0
我知道那裏可能有類似的問題，但我仍然無法找到答案。任何人都可以幫助我。Dojo Grid按鈕點擊後重新加載數據文件
有5個部門，每個部門有4個產品。所以我創建了5個按鈕和4個選項卡，每個選項卡都包含一個網格。默認情況下，部門A已加載，用戶可以切換標籤以查看來自該部門的不同產品信息。通過點擊另一個按鈕B，部門B的信息將加載到所有4個選項卡。
點擊每個按鈕會向後端PHP代碼發送ajax請求，PHP會讀取XML文件做計算並將數據寫入「data \ productA.json」，「data \ productB.json」，「data \ productC .json「，」data \ productD.json「文件，尊重產品A到產品D的特定部門。請注意，第一個選項卡總是從「data \ product A」文件中讀取，無論您點擊了哪個按鈕，對於其他選項卡都是如此。
然後，JavaScript將從「data \ product？.json」文件中讀取並在網格中顯示數據。
頁面加載時，第一部門的信息被正確加載到網格中。但是，如果我更改爲其他部門（單擊按鈕），網格將不會從json文件重新加載數據。
這裏是JS部分：
dojo.addOnLoad(function() {
//init the first main column when load the page.
getDepartmentA();
var layout = [[
new dojox.grid.cells.RowIndex({ width: 5 }),
{name: 'Name', field: 'name'},
{name: 'Count', field: 'count'},
{name: 'Percent', field: 'percent'}
]];
var store = new dojo.data.ItemFileReadStore({ url: "data/productA.json" });
var grid = new dojox.grid.DataGrid({ store: store, rowsPerPage: 200, style: "height:600px; width:874px;", structure: layout},
dojo.byId("grid1"));
grid.startup();
dojo.connect(dijit.byId("column3"),"onShow", dojo.partial(createGrid, "3") );
dojo.connect(dijit.byId("column4"),"onShow", dojo.partial(createGrid, "4") );
dojo.connect(dijit.byId("column5"),"onShow", dojo.partial(createGrid, "5") );
});
function getDepartmentA() {
dojo.xhrGet({
url: "department_A_process.php",
handleAs: "json",
load: function(response) {
var tempgrid = grids[0];
var tempresponse = eval("("+response+")");
var tempstore = new dojo.data.ItemFileReadStore({url: "data/productA.json" }); //updated store!
var tempModel = new dojox.grid.data.DojoData(null, tempstore, {query:{productName:'*'}, clientSort: true});
tempgrid.setaModel(tempModel);
tempgrid.refresh();
console.dir(response); // Dump it to the console
}
});
}
function createGrid(id) {
console.log("Calling createGrid function now!");
var layout = [[
new dojox.grid.cells.RowIndex({ width: 5 }),
{name: 'Name', field: 'name'},
{name: 'Count', field: 'count'},
{name: 'Percent', field: 'percent'}
]];
if (! grids[id]) {
if (id =="1"){
var store = new dojo.data.ItemFileReadStore({ url: "data/productA.json" });
console.log("I am in tab1");
} else if (id =="3"){
var store = new dojo.data.ItemFileReadStore({ url: "data/productB.json" });
console.log("I am in tab3");
} else if (id =="4"){
var store = new dojo.data.ItemFileReadStore({ url: "data/productC.json" });
console.log("I am in tab4");
} else if (id =="5"){
var store = new dojo.data.ItemFileReadStore({ url: "data/productD.json" });
console.log("I am in tab5");
}
var grid = new dojox.grid.DataGrid({ store: store, rowsPerPage: 200, style: "height:600px; width:874px;", structure: layout},
dojo.byId("grid" + id));
grid.startup();
grids[id] = grid;
console.log(grid);
}
}
我的索引頁是這樣的：
<div id="mainTabContainer" dojoType="dijit.layout.TabContainer" doLayout="false">
<div id="column1" dojoType="dijit.layout.ContentPane" title="Label by Brand" selected="true">
<h1>Label by Brand</h1>
<div class="partsContainer">
<div id="grid1" class="gridContainer">
</div>
</div>
</div>
<div id="column3" dojoType="dijit.layout.ContentPane" title="Session Types">
<h1>Session Types</h1>
<div class="partsContainer">
<div id="grid3" class="gridContainer">
</div>
</div>
</div>
<div id="column4" dojoType="dijit.layout.ContentPane" title="Labels by Session">
<h1>Labels by Session</h1>
<div class="partsContainer">
<div id="grid4" class="gridContainer">
</div>
</div>
</div>
<div id="column5" dojoType="dijit.layout.ContentPane" title="Monthly Report">
<h1>Monthly Report</h1>
<div class="partsContainer">
<div id="grid5" class="gridContainer">
</div>
</div>
</div>
</div>
JSON文件看起來像：
{
identifier: "productName",
label: "productName",
items: [
{ "productName" : "p1", "count" : 3362, "percent" : "32.8" },
{ "productName" : "p2", "count" : 421, "percent" : "4.1" },
{ "productName" : "p3", "count" : 526, "percent" : "5.1" },
{ "productName" : "p4", "count" : 1369, "percent" : "13.4" },
...
{ "productName" : "Total", "count" : 10242, "percent" : "100" }
]
}
任何人都可以幫幫忙，怎麼重裝PHP生成的網格文件？謝謝。