Datagrid初始化设置
$('#post').datagrid({ url :'remote.php', fitColumns : true, striped : true, rownumbers : true, border : false, pagination : true, pageSize : 20, pageList : [10, 20, 30, 40, 50], pageNumber : 1, sortName : 'create_time', sortOrder : 'DESC', columns : [[ { field : 'id', title : 'Id', width : 100, checkbox : true }, { field : 'name',title : 'Name', width : 100 }, { field : 'create_time', title : '创建时间', width : 100, sortable : true } ]], toolbar:$('#post-tool')});
说明：
url:后台数据调用地址。如果是现有json格式数据，则用data代替urldata:如果没有url属性，则用该属性表示需要加载的数据。数据格式为：data: [ {f1:'value11', f2:'value12'}, {f1:'value21', f2:'value22'} ]fitColumns: 使表格自适应页面宽度
striped:条纹显示rownumbers:显示行号pagenation:是否分页pageSize:每页显示记录数pageList:每页记录数选择范围设置pageNumber:当前页号sortName:排序列名称 设置后将向后台传送名为sort的post/get参数sortOrder:排序列升降序 设置后将向后台传送名为order的post/get参数columns:datagrid的每一列的具体设置。详细设置见下文。checkOnSelect:如set true,如有checkbox列，则点击该行后该行和其checkbox一起为选中状态。selectOnCheck: 如set true,如有checkbox列，则点击该行的checkbox会连同该行一起被选中。toolbar:工具栏。可放入增删改查等easyui格式的linkbutton.可先在页面设置div,然后在toolbar指定该div的id, 也可以按以下方法设置：$('#dg').datagrid({ toolbar: [{ iconCls: 'icon-edit', handler: function(){alert('edit')} },'-',{ iconCls: 'icon-help', handler: function(){alert('help')} }]});//iconCls:easyui的图标class,handler:点击按钮时触发的function
其他属性：
loadMsg:加载数据时的提示信息emptyMsg:加载数据为空时的信息singleSelect:只能单选记录ctrlSelect:可ctrl+点击多选记录pagePosition:分页栏位置，可选 'top', 'bottom', 'both'queryParams:向后台传递的附加参数rowStyler: function根据数据加工该行样式。可以是内联样式，也可以是class. 实例如下：$('#dg').datagrid({ rowStyler: function(index,row){ if (row.listprice>80){ return 'background-color:#6293BB;color:#fff;'; } }});//参数：index:该行索引 row:该行数据集
Columns属性：
columns : [[ { field : 'id', title : 'Id', width : 100, checkbox : true }, { field : 'name',title : 'Name', width : 100 }, { field : 'create_time', title : '创建时间', width : 100, sortable : true } ]]
field:从后台取得的数据记录中的相应字段名
title:显示在表头的每列标题checkbox:是否以checkbox表现此列sortable:是否可排序order:升降序resizable:是否可改变大小fixed:当表格fitColumns属性为true,即自适应宽度时，设置fixed为true禁止自动改变此列宽度hidden:是否隐藏此列formatter:用function加工数据内容格式 见以下实例：$('#dg').datagrid({ columns:[[ {field:'userId',title:'User', width:80, formatter: function(value,row,index){ if (row.user){ return row.user.name; } else { return value; } } } ]]});//参数： value:该单元格数据 row:该行数据 index:该行索引
styler:用function 根据数据返回单元格相应的style,可以是内联样式，也可以是class 见如下实例：
$('#dg').datagrid({ columns:[[ {field:'listprice',title:'List Price', width:80, align:'right', styler: function(value,row,index){ if (value < 20){ return 'background-color:#ffee00;color:red;'; } } } ]]});