感謝這裏的一些幫助,我得到了Dojo dgrid的工作;甚至想出瞭如何將它與我的休息服務中的數據聯繫起來。dgrid(onDemandGrid)在第一次點擊按鈕時加載,但第二次點擊時出錯按鈕被點擊
現在我添加了一個輸入框,一個按鈕,所有的邏輯發生在按鈕單擊。但是,第二次點擊按鈕時,即使在輸入字段中有相同的輸入值,我也會得到一個錯誤。
錯誤:
類型錯誤:無法讀取性能在StoreMixin.js未定義的 '元素':33
我讀到這How To reset the OnDemandGrid,但有必要檢查網格是否存在並執行不同的邏輯?我不能每次都「新」一個新的嗎?
CODE:
<div data-dojo-type="dijit/layout/ContentPane" data-dojo-props='title:"CustomersGrid"'>
<label for="lastnameStartsWith">Lastname Starts With:</label>
<input id="lastnameStartsWith" type="text" name="lastnameStartsWith" value="Wag"
data-dojo-type="dijit/form/TextBox"
data-dojo-props="trim:true, propercase:true" />
<br />
<br />
<button id="queryStudentsButton" data-dojo-type="dijit/form/Button"
data-dojo-type="dijit/form/Button"
data-dojo-props="iconClass:'dijitIconTask'">
<span>Query</span>
<script type='dojo/on' data-dojo-event='click'>
require([
'dstore/RequestMemory',
'dstore/Memory',
'dgrid/OnDemandGrid'
], function (RequestMemory, Memory, OnDemandGrid) {
var url = '../students/' + dojo.byId('lastnameStartsWith').value;
console.log("query students for dataGrid latsnameStartsWith:" + dojo.byId('lastnameStartsWith').value);
require(['dojo/request'], function(request){
request.get(url,
{headers: {"Content-Type": 'application/json',
"username": securityConfig.username,
"password": securityConfig.password}}
)
.then(function(response){
//console.log("string response=" + response);
var respJSON = JSON.parse(response);
var respDataForDGrid = respJSON.recordset;
console.log("got respJSON back, num rows= " + respDataForDGrid.length);
//================================================
// Create an instance of OnDemandGrid referencing the store
console.log("Debug1");
var grid2 = new OnDemandGrid({
collection: new Memory({ data: respDataForDGrid }),
columns: {
student_id: 'ID',
student_firstname: 'First Name',
student_lastname: 'Last Name',
student_city: 'City',
student_state: 'State',
student_zip: 'Zip'
}
}, 'grid2');
console.log("Debug2");
grid2.startup();
console.log("Debug3");
},
function(error){
console.log("Error=" + error);
//dom.byId('studentFeedback').value += response;
});
});
});
</script>
</button>
<h2>My demoGrid - From JSON RestService (Database)</h2>
<div id='grid2'></div>
</div>
部分 -
我試過此頁面上的代碼和代碼的組合: How To reset the OnDemandGrid
if (grid2Registered){
console.log("reuse existing grid");
grid2Registered.set('collection', memStore);
// refresh: clear the grid and re-queries the store for data.
grid2Registered.refresh();
}
else{...
Doc here(https://github.com/SitePen/dgrid/blob/v0.4.3/doc/components/core-components/OnDemandList-and-OnDemandGrid.md)說:
Clears the grid and re-queries the store for data. If keepScrollPosition is true on either the instance or the options passed to refresh, an attempt will be made to preserve the current scroll position. OnDemandList returns a promise from refresh, which resolves when items in view finish rendering. The promise resolves with the QueryResults that were rendered.
如果您已經創建了網格,那麼在您的結構/列保持不變的情況下使用新的商店刷新網格總是可取的(至少這是我所做的)。這樣,您可以避免每次查詢時創建網格的開銷。 –
那麼你會如何實現呢?保持一個櫃檯?或者檢查如何檢查我的grid2是否先前已定義? – NealWalters
如果您採用模板化方法,即在html中定義小部件,則可以使用data-dojo-attach-point來引用網格。如果採取編程方式,則可以爲網格分配一個id(請注意,對於每個dijit,id必須是唯一的),並將其引用爲dijit.byId('yourId')。 –