jQuery EasyUI datagrid中的loadFilter和loadData用法

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, "&lt;").replace(/>/g, "&gt;");
                   }
               }
        }
        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;" onclick="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

<body>
<div id="win" title="My Window"></div>
<table id="test"></table>
</body>

 

loadData ： 參數(data) 加載本地數據，舊的行會被移除。
loadFilter : 類型(function) 返回過濾的數據去顯示。這個函數需要一個參數'data'，表示原始數據。你可以把原始數據變成標准數據格式，此函數必須返回標准數據對象，含有 'total' 和 'rows' 特性。