数据表格 - DataGrid - 列表显示

<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %>
<%
    String homePage = request.getContextPath();
%>
<script type="text/javascript">
    $(function () {
        $("#datagrid").datagrid({
            url: "<%=homePage%>/testController/datagrid.ajax?type=list",
            title: "标题",
            iconCls: "icon-save",
            pagination: true,
            pageSize: 10,
            pageList: [10, 20, 30, 40, 50, 60, 70, 80, 90, 100],
            fit: true,
            fitColumns: true,//列少的时候,设置为true比较合适
            nowrap: false,//false - 单元格数据多的时候进行折行  true - 不管数据有多少,都在一行显示
            border: false,
            idField: "id",
            columns: [
                [
                    {field: "id", title: "编号", width: 100}
                    , {field: "name", title: "姓名", width: 100}
                    , {field: "password", title: "密码", width: 100}
                ]
            ]
        });
    })
</script>

<div class="easyui-tabs" fit="true" border="false">
    <div title="用户管理">
        <table id="datagrid"></table>
    </div>
</div>

后端

@RequestMapping(value = "/datagrid.ajax", params = "type=list")
@ResponseBody
public Map<String, Object> datagrid1(@RequestParam Map<String, String> map) {
    logger.debug("参数:" + map);
    Map<String, Object> map1 = new HashMap<>();
    List<Map<String, String>> list = new ArrayList<>();
    for (int i = 0; i < 100; i++) {
        Map<String, String> map2 = new HashMap<>();
        list.add(map2);
        map2.put("id", i + "");
        map2.put("name", "姓名" + i);
        map2.put("password", "密码" + i);
    }
    map1.put("rows", list);
    map1.put("total", 100);
    return map1;
}



因为设置了分页，每次查询的时候，都会把page和rows参数传递给后台，后台拿着这个参数，进行分页查询后，将结果集存在rows中，把总条数存在total中。

这就实现了一个简单的分页列表了，以为还没有查询条件，还不能叫做分页查询