转载：
https://www.cnblogs.com/huangf714/p/5835669.html
EasyUI比较常用，其中的datagrid比较复杂，它有其中有load,reload,loadData这三个方法，它们都有相同的功能，都是加载数据的，但又有区别。
load方法，比如我已经定义一个datagrid的id为grid，那这个方法的使用方式为
$(“#grid”).datagrid(“load”,{ });
它的参数为一个json对象，里面写的是你要传输的参数的键值对，调用这个方法来加载数据的时候，它传给后台的分页信息是从第一页开始的。
reload方法，使用方式也跟load的一样
$(“#grid”).datagrid(“reload”,{ });
看它的名字应该就可以知道它的做用了，没错，它跟load一样有加载数据功能，也一样的传参数，但它传给后台的分布信息是当前的页码，就是实现刷新当前页的功能。
loadData方法，这个方法有比较大的不同，首先它加载的本地数据，就是不会跟后台什么的有交互，它的使用方式是
$(“#grid”).datagrid(“loadData”,{ “total”:”30″,rows:[] });
看到没，它是比较灵活的，可以设置分页信息的，total就是行数嘛，当然你也可以设置它的当前页，而它那个rows属性设的就是你所要加载的行的集合。
var bbc="";
$(function(){ $("#test").datagrid({ loadFilter: function (data){bbc=data;return bbc;},/*loadFilter: function (data) { for (var i = 0; i < data.rows.length; i++) { for (var att in data.rows[i]) { if (typeof (data.rows[i][att]) == "string") { data.rows[i][att] = data.rows[i][att].replace(/</g, "<").replace(/>/g, ">");}}}return data;} ,*/title:'My DataGrid',//iconCls:'icon-save',//nowrap: false,//striped: true,//collapsible:true,url:'datagrid_data001.json',//sortName: 'code',//sortOrder: 'desc',//remoteSort: false,singleSelect:true,rownumbers:true,idField:'code',frozenColumns:[[/*{field:'ck',checkbox:true},*/{title:'退货单号',field:'code',width:80,sortable:true, rowspan:2}]],columns:[[{title:'退货单明细',colspan:3},{field:'opt',title:'操作',width:100,align:'center', rowspan:2,formatter:function(value,rec){ return '<span style="color:#08f;cursor:pointer;" οnclick="kankan(this)">查看</span>';}}],[{field:'name',title:'申请人',width:100},{field:'money',title:'申请金额',width:100,rowspan:2,sortable:true,sorter:function(a,b){ return (a>b?-1:1);}},{field:'col4',title:'审核状态',width:100,rowspan:2}]]});})function kankan(she){ var bb=$(she).parent().parent().parent().attr("datagrid-row-index");/*alert(bb);$("#test").datagrid('selectRow',0)var row=$("#test").datagrid('getSelected');alert(row.id)*/var ccb={total:bbc.total,rows:[bbc.rows[bb]]}/*var ccb='"total"';ccb=ccb+":";ccb=ccb+bbc.total;ccb=ccb+",";ccb=ccb+'"rows":';ccb=ccb+"[";ccb=ccb+bbc.rows[bb];ccb=ccb+"]";*/$('#win').window({ width:600, height:400, modal:true,collapsible:false,minimizable:false,maximizable:false});//$("#win").text(item.address); $("#win").datagrid({ //rowStyler:function(bb,bb){return 'background:#fff'},//url:'datagrid_data001.json',singleSelect:true,columns:[[{title:'退货单号',field:'code',width:80,align:'center'},{field:'name',title:'申请人',width:100,align:'center'},{field:'money',title:'申请金额',width:100,align:'center'},{field:'col4',title:'审核状态',width:100,align:'center'},{field:'address',title:'地址',width:180,align:'center'}]]})//alert(bbc.total);$(function(){ $('#win').datagrid('loadData', ccb); /*alert('here');*/})}
数据源
{
"total":10456239, "rows":[ {"id":"1","code":"001","name":"张一一","money":"$ 129.00","col4":"待审核","address":" Shanghai Pudong China1"}, {"id":"2","code":"002","name":"张一二","money":"$ 119.00","col4":"待审核","address":" Anhai Pudong China2"}, {"id":"3","code":"003","name":"张一三","money":"$ 128.00","col4":"待审核","address":" Shanghai Pudong China3"}, {"id":"4","code":"004","name":"张一四","money":"$ 118.00","col4":"待审核","address":" Anhai Pudong China4"}, {"id":"5","code":"005","name":"张一五","money":"$ 109.00","col4":"待审核","address":" Shanghai Pudong China5"}, {"id":"6","code":"006","name":"张一六","money":"$ 109.00","col4":"待审核","address":" Anhai Pudong China6"}, {"id":"7","code":"007","name":"张一七","money":"$ 159.00","col4":"待审核","address":" Anhai Pudong China7"}, {"id":"8","code":"008","name":"张一八","money":"$ 158.00","col4":"待审核","address":" Anhai Pudong China8"}, {"id":"9","code":"009","name":"张一九","money":"$ 156.00","col4":"待审核","address":" Shanghai Pudong China9"}, {"id":"10","code":"010","name":"张一十","money":"$ 158.00","col4":"待审核","address":" Shanghai Pudong China10"} ] }html
loadData ： 参数(data) 加载本地数据，旧的行会被移除。 loadFilter : 类型(function) 返回过滤的数据去显示。这个函数需要一个参数'data'，表示原始数据。你可以把原始数据变成标准数据格式，此函数必须返回标准数据对象，含有 'total' 和 'rows' 特性。