Ext.require(['Ext.data.*', 'Ext.grid.*']);
Ext.onReady(function () {
var temp, fieldItems, columnItems;
Ext.Ajax.request({
url: '../Home/GetAutoGrid',
method: 'GET',
success: function (response, options) {
temp = response.responseText;
alert(222);
var allStr = temp.split("&");
fieldItems = Ext.JSON.decode(allStr[0]);
columnItems = Ext.JSON.decode(allStr[1]);
//Ext.MessageBox.alert('成功', '从服务端获取结果: ' + response.responseText);
},
failure: function (response, options) {
Ext.MessageBox.alert('失败', '请求超时或网络故障,错误编号：' + response.status);
}
});
Ext.define('MyData', {
extend: 'Ext.data.Model',
fields: fieldItems
});
alert(111);
var mystore = Ext.create('Ext.data.Store', {
//分页大小
pageSize: 20,
model: 'MyData',
proxy: {
type: 'ajax',
url: '../Home/Load',
reader: { type: 'json', root: 'rows', totalProperty: 'results' }
},
sorters: [{
property: 'id', //排序字段
direction: 'asc'// 默认ASC
}]
})
var grid = Ext.create('Ext.grid.Panel', {
title: 'grid加载远程数据',
width: 600,
simpleSelect: true,
multisSelect: false,
store: mystore,
loadMask: true, //加载提示{ msg: '正在加载数据，请稍侯……' }
selModel: new Ext.selection.CheckboxModel, //添加checkbox列
columns: columnItems,
dockedItems: [
{
xtype: 'pagingtoolbar',
store: mystore, // same store GridPanel is using
dock: 'bottom', //分页 位置
emptyMsg: '没有数据',
displayInfo: true,
displayMsg: '当前显示{0}-{1}条记录 / 共{2}条记录 ',
beforePageText: '第',
afterPageText: '页/共{0}页'
}, {
xtype: 'toolbar',
items: [{
iconCls: 'icon-add',
text: '增加',
scope: this, //添加
handler: function () {
Panel.show(); //显示
}
}, {
iconCls: 'icon-delete',
text: '删除',
//disabled: true,
itemId: 'delete',
scope: this,
handler: function () {
//var selModel = grid.getSelectionModel();
var selected = grid.getSelectionModel().getSelection();
var Ids = []; //要删除的id
Ext.each(selected, function (item) {
Ids.push(item.data.id); //id 对应映射字段
})
alert(Ids);
}
}]
}],
listeners: {
//监听单击事件 records 当前行 对象
itemclick: function (dv, records, item, index, e) {
alert(record.data.id);
}, selectionchange: function (model, records) {
if (records[0]) {
Panel.show(); //显示
Panel.loadRecord(records[0]);
//alert(records['name']);
//alert(records[0]);
}
}
},
renderTo: Ext.getBody()
})
//初始加载第1页
mystore.loadPage(1);
上边为js代码，主要是为了实现，列表中的列从数据库中获取，动态的实现。 现在遇到的问题是，当我用Ext.ajax.request 取出来的数据，是异步的，当我列表都加载完之后，fieldItems,columnItems 才有数据， 这个该怎么解决。 本人初学Extjs 。。