easyui表格的实现

第一步，在jsp页面引入需要的文件

<script type="text/javascript"src="assets/bootstrap/jquery-2.2.3.min.js"></script>
<script type="text/javascript" src="assets/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript"src="assets/easyui/locale/easyui-lang-zh_CN.js"></script>

第二步，准备容器和js初始化

<div id="maBody" class="maBody"></div>

/**
 * 初始化加载表格
 */
 <script type="text/javascript">
function init() {
    urlstr = 'rest/company/selectCompany';
    $("#maBody").datagrid(
            {
                columns : [ [
                        {
                            field : 'ck',
                            checkbox : true
                        },
                        {
                            field : 'id',
                            hidden : true,
                            width : 200
                        },
                        {
                            field : 'companyName',
                            title : '企业名称',
                            width : 200,
                            formatter : function(value, row, index) {
                                return "<a href='rest/company/companyInfoDetail?id="+row.id+"' target='_blank'>" + value + "</a>";
                            }
                        },
                        {
                            field : 'auditState',
                            title : '数据状态',
                            width : 200
                        },
                        {
                            field : 'lastEditTime',
                            title : '创建时间',
                            width : 200,
                            formatter : function(value, row, index) {
                                /* 时间转化 */
                                var d = new Date(value.time);
                                var tt = d.getFullYear() + '-'
                                        + (d.getMonth() + 1) + '-'
                                        + d.getDate();
                                return tt;
                            }
                        } ] ],
                method : 'post',
                url : urlstr,
                title : '企业审核',
                cache : false,
                pagination : true,
                rownumbers : true,
                /* collapsible:true, */
                loadMsg : '装载中...',
                onLoadError : function() {
                    ('加载数据失败!');
                },
                pageSize : 20,
                pageNumber : 1,
                width : 900,
                height : 450,
                pageList : [ 20, 50, 100, 500 ],
                nowrap : false,
                striped : true,
                fitColumns : true,
                collapsible : false,
                remoteSort : false,
                pagination : true,
                rownumbers : true,
                queryParams : {
                    mc : "",
                    zt : "",
                    sj : ""
                },
                toolbar : [ {
                    text : '审核',
                    iconCls : 'icon-add',
                    handler : function() {
                        audit(1);
                    }
                }, {
                    text : '驳回',
                    iconCls : 'icon-remove',
                    handler : function() {
                        reject(1);
                    }
                } ]
            });
}
</script>

第三步，写后台java代码获取数据

/**
     * 查询审核企业
     * 
     * @throws IOException
     */
    @RequestMapping(value = "/selectCompany", method = RequestMethod.POST)
    public void selectCompany(@RequestParam String mc, @RequestParam String zt, @RequestParam String sj,
            @RequestParam String page, @RequestParam String rows) throws IOException
    {
        JSONObject js = new JSONObject();
        Page<CompanyInfo> companyInfo = icompanInfoService.findAllAudit(mc, zt, sj, Integer.parseInt(page),
                Integer.parseInt(rows));
        js.accumulate("total", companyInfo.getTotal());
        js.accumulate("rows", companyInfo.getResult());
        response.getWriter().write(js.toString());
    }

这样，一个表格的创建和数据获取就完成了，如下图