javascript - 从后台取回的json数组,如何用easyui的datagrid显示出来?

Question

点击button调用getAll方法从数据库取数据
jsp代码:

<input type="text" class="txt">
<button onclick="getAll()">查询</button><br/>
<table id="dg-order" ></table>

js代码:
     function getAll(){
            var text = $('.txt').val();
            $.ajax({
              url:basePath+"list/all",
              data:{
                 userid:text,
                 },
              success:function(result){
              $('#dg-order').datagrid("loadDate",result);
              }
           });
        };

result为返回的json字符串[{"address":"将军路","orderItemList":[{"id":180,"num":2,"price":40.0}],"status":0,"userId":16}]

Answer 1

之前做了个项目后台是easyui，做了分页每页20条数据：

页面引入easyui库，table加上class="easyui-datagrid"

<table id="dg" class="easyui-datagrid" title="用户信息" style="height:500px" data-options="
            rownumbers:true,
            singleSelect:true,
            autoRowHeight:true,
            pagination:true,
            pageSize:20,
            url:'<%=request.getContextPath()%>/admin/user/list-by-page.jspx',
            method:'get',
            toolbar:'#tb'">
    <thead>
        <tr>
            <th data-options="field:'id',width:50">ID</th>
            <th data-options="field:'nickname',width:250">手机号码</th>
            <th data-options="field:'equipIds',width:300">绑定装备</th>
            <th data-options="field:'currentequiment',width:150">当前装备</th>
            <th data-options="field:'createtime',width:150">注册时间</th>
        </tr>
    </thead>
</table>

搜索加载数据

我这里搜索条件是：用户ID

$('#dg').datagrid('load',{
    accountId: $('#accountId').val(),
});

服务器返回数据格式

后台api数据应该按照这种格式返回：

{
    "total": 15, 
    "rows": [
        {
            "createtime": "2016-07-06 16:26:04", 
            "id": 7, 
            "createTime": 1467793564, 
            "nickname": "13433333333(Jan)", 
            "updateTime": 1470795733, 
            "currentequiment": 0, 
            "equipIds": ""
        }, 
        ...
    ]
}