很长一段时间以来,我一直困在这一点。请帮我识别我的错误。
我正在尝试在网格面板中显示数据,因为数据很大,我也在使用分页工具栏。这是我的代码(我不确定,但我认为问题存在于我正在创建中)。
var myData = {
record: [{
name: "Record 0",
column1: "0",
column2: "0"
}, {
name: "Record 1",
column1: "1",
column2: "1"
}, {
name: "Record 2",
column1: "2",
column2: "2"
},
]
};
var fields = [{
name: 'name',
mapping: 'name'
}, {
name: 'column1',
mapping: 'column1'
}, {
name: 'column2',
mapping: 'column2'
}
];
var store = new Ext.data.Store({
id: 'simpsonsStore',
fields: ['name', 'column1', 'column2'],
pageSize: 5, // items per page
data: myData,
reader: {
root: 'record',
type: 'json'
}
});
// Column Model shortcut array
var cols = [{
id: 'name',
header: "Record Name",
width: 50,
sortable: true,
dataIndex: 'name'
}, {
header: "column1",
width: 50,
sortable: true,
dataIndex: 'column1'
}, {
header: "column2",
width: 50,
sortable: true,
dataIndex: 'column2'
}
];
store.load({
params: {
start: 0,
limit: 5
}
});
// declare the source Grid
var grid = new Ext.grid.GridPanel({
ddGroup: 'gridDDGroup',
store: store,
columns: cols,
enableDragDrop: true,
stripeRows: true,
autoExpandColumn: 'name',
width: 650,
height: 325,
region: 'west',
title: 'Data Grid',
selModel: new Ext.grid.RowSelectionModel({
singleSelect: true
}),
dockedItems: [{
xtype: 'pagingtoolbar',
store: store, // same store GridPanel is using
dock: 'bottom',
displayInfo: true
}
]
});
var displayPanel = new Ext.Panel({
width: 650,
height: 300,
layout: 'column',
renderTo: Ext.getBody(),
items: [
grid
],
bbar: [
'->', {
text: 'Reset Example',
handler: function () {
gridStore.loadData(myData);
}
}
]
});
答案 0 :(得分:0)
从 myData.record 数组中的无关逗号开始,将阻止其运行。
var myData = {
record : [
{ name : "Record 0", column1 : "0", column2 : "0" },
{ name : "Record 1", column1 : "1", column2 : "1" },
{ name : "Record 2", column1 : "2", column2 : "2" }**,**
]
};
答案 1 :(得分:0)
尝试在网格框中设置分页栏,而不是dockedItems。 新的Ext.PagingToolbar({ pageSize:20, 商店:商店, displayInfo:true });