extjs grid demo
Ext.onReady(function () { var store = Ext.create('Ext.data.Store', { fields: ['id', 'name', 'account', 'password'], pageSize: 20, remoteSort: false, remoteFilter: true, proxy: { type: 'ajax', actionMethods: { read: 'POST' }, url: h.url + '/t/100', reader: { type: 'json', root: 'rows', totalProperty: 'total' } }, autoLoad: true }); var grid = Ext.create('Ext.grid.Panel', { renderTo: Ext.getBody(), title: '用户列表', store: store, width: 800, height: 400, margin: 20, columns: [ {text: 'id', dataIndex: 'id'}, {text: 'name', dataIndex: 'name', flex: 1}, {text: 'account', dataIndex: 'account'}, {text: 'password', dataIndex: 'password'} ], bbar: [ { xtype: 'pagingtoolbar', store: store, displayMsg: '显示 {0} - {1} 条,共计 {2} 条', emptyMsg: "没有数据", beforePageText: "当前页", afterPageText: "共{0}页", displayInfo: true } ], tbar: [ {text: '新增', iconCls: 'add', handler: add}, "-", {text: '编辑', iconCls: 'edit', handler: edit}, "-", {text: '删除', iconCls: 'delete', handler: del}, "-" ] }); });