Grid源码: /**//** * @author sunfishlu */ var simplyGrid = { data: null, url_data: null, //Grid数据源 url_column: null, //列数据源 _width: null, //宽度 _height: null, //高度 _pagesize: null, //每页显示数据数 romanceContainer: null, //渲染Grid的容器 hiddenColumnCount: null, //隐藏的列数,默认无隐藏列 enableChecked: false, //是否有CheckBox,默认为无。 grid: null, ToHrefField: null, //链接列 ToHrefUrl: null, //链接地址 ToHref: function(value) { return '<a href=" + simplyGrid.ToHrefUrl + " mce_href=" + simplyGrid.ToHrefUrl + ">' + value + '</a>'; }, simply: function() { //动态添加列 var addColumn = function() { this.fields = ''; this.columns = ''; this.addColumns = function(name, caption) { if (this.fields.length > 0) { this.fields += ','; } if (this.columns.length > 0) { this.columns += ','; } this.fields += '{name:"' + name + '"}'; if (simplyGrid.ToHrefField == name) { this.columns += '{header:"' + caption + '",dataIndex:"' + name + '",width:100, menuDisabled:true,sortable:true,renderer:' + simplyGrid.ToHref + '}'; } else { this.columns += '{header:"' + caption + '",dataIndex:"' + name + '",width:100, menuDisabled:true,sortable:true}'; } }; }; //从服务器端获取列,然后动态添加到ColumnModel中 Ext.Ajax.request ({ url: simplyGrid.url_column, success: function(response, option) { if (response.responseText == "") { return; } simplyGrid.data = new addColumn(); var res = Ext.util.JSON.decode(response.responseText); for (var i = 0; i < res.length; i++) { for (var p in res[i]) { simplyGrid.data.addColumns(p, p); } } //动态生成GridPanel makeGrid(); }, failure: function() { Ext.Msg.alert("消息", "查询出错---->请打开数据库查看数据表名字是否正确"); } }); //动态生成GridPanel var makeGrid = function() { if (simplyGrid.enableChecked) { var sm = new Ext.grid.CheckboxSelectionModel({ singleSelect: false, moveEditorOnEnter: true, sortable: false }); var arr = [sm]; var sunfish = eval('([' + simplyGrid.data.columns + '])'); for (var i = 0; i < sunfish.length; i++) { arr.push(sunfish[i]); } } else { arr = eval('([' + simplyGrid.data.columns + '])'); } var cm = new Ext.grid.ColumnModel(arr); //隐藏列 if (simplyGrid.hiddenColumnCount != null) { for (var j = 0; j < simplyGrid.hiddenColumnCount; j++) { cm.setHidden(j, true); } } cm.defaultSortable = true; var fields = eval('([' + simplyGrid.data.fields + '])'); var newStore = new Ext.data.Store ({ proxy: new Ext.data.HttpProxy({ url: simplyGrid.url_data }), reader: new Ext.data.JsonReader({ totalProperty: "totalPorperty", root: "root", fields: fields }) }); newStore.load({ params: { start: 0, limit: simplyGrid._pagesize} }); var pagingBar = new Ext.PagingToolbar ({ displayInfo: true, emptyMsg: "没有数据显示", displayMsg: "显示从{0}条数据到{1}条数据,共{2}条数据", store: newStore, pageSize: simplyGrid._pagesize }); var gridPanel = new Ext.grid.GridPanel ({ sm: sm, cm: cm, id: "grid_panel", renderTo: simplyGrid.romanceContainer, store: newStore, frame: true, border: true, layout: "fit", pageSize: simplyGrid._pagesize, width: simplyGrid._width, height: simplyGrid._height, viewConfig: { forceFit: true }, bbar: pagingBar }); simplyGrid.grid = gridPanel; }; } } 在页面中简单调用如下: function init() { simplyGrid.url_data = "jsonGridDynamic.aspx?param=data"; //Grid数据源 simplyGrid.url_column = "jsonGridDynamic.aspx?param=column"; //列数据源 simplyGrid._width = Ext.get("grid_div").getComputedWidth(); //宽度 simplyGrid._height = 400; //高度 simplyGrid.romanceContainer = 'grid_div'; //渲染Grid的容器 simplyGrid._pagesize = 16; //每页显示数据数 simplyGrid.hiddenColumnCount = 0; //隐藏的列数,默认无隐藏列 simplyGrid.enableChecked = true; //是否有CheckBox,默认为无。 simplyGrid.ToHrefField = "TypeCName"; simplyGrid.ToHrefUrl = "about:blank"; simplyGrid.simply(); } Ext.onReady(init);