2.MVC怎么用Layui创建表格

1.到Layui官方下载layui放入到我们的项目中去
2.导入包

1. <script src="~/Scripts/layui-v2.5.4/layui/layui.js"></script>
2. <link rel="stylesheet" href="~/Scripts/layui-v2.5.4/layui/css/layui.css" />
   3.在数据库把查询的东西转换成List
   4.在网页中写以下代码

网页

 <table id="demo" lay-filter="test"></table>

按钮js

<script type="text/html" id="barDemo">
                            <span class="td-manage">
                                <a lay-event="detail" href="javascript:;" title="详情" class="btn btn-xs btn-success"><i class="fa fa-list-ul bigger-120"></i></a>
                                <a lay-event="edit" title="编辑" href="javascript:;" class="btn btn-xs btn-info"><i class="fa fa-edit bigger-120"></i></a>
                                <a lay-event="del" title="删除" href="javascript:;" class="btn btn-xs btn-warning"><i class="fa fa-trash  bigger-120"></i></a>
                            </span>
                        </script>

js

table.render({
      elem: '#demo'
      ,height: 312
      ,url: '/MainS/AdminInfoInfo' //数据接口
      ,page: true //开启分页
        , cols: [[ //表头
            { field:'AdminId', title: 'ID', width: 80, sort: true, fixed: 'left' }
            , { field:'LoginName', title: '用户名', width: 80 }
            , { field:'Telphone', title: '电话号码', width: 80, sort: true }
            , { field:'Email', title: '电子邮箱', width: 80 }
            , { field:'RoleId', title: '职位', width: 177 }
            , { field: 'CreateTime', title: '创建时间', width: 177, sort: true, templet: '<div>{{Format(d.CreateTime,"yyyy-MM-dd hh:mm:ss")}}</div>' }
             ,{fixed: 'right',title: '操作', width: 165, align:'center', toolbar: '#barDemo'}



        ]]
        ,page: true
    });





     table.on('tool(test)', function(obj){                     //带按钮
                            var data = obj.data;
                              if (obj.event === 'detail') {
                                  member_detail(data);
                              //layer.msg('ID：'+ data.MId + ' 的查看操作');
                            } else if(obj.event === 'del'){
                              layer.confirm('真的删除行么', function(index){
                                  obj.del();
                                  member_del(data)
                                layer.close(index);
                              });
                              } else if (obj.event === 'edit') {
                                  member_edit(data);
                              //layer.alert('编辑行：<br>'+ JSON.stringify(data))
                            }
                          });


         });

5.分页在控制器里面写

 public JsonResult AdminInfoInfo(int page,int limit)
        {
           
            AdminService admin = new AdminService();
            List<AdminInfo> adminInfos= admin.AdminInfoInfo();
            PageListResult<AdminInfo> test = new PageListResult<AdminInfo>();
            test.code = 0;
            test.msg = "";
            test.count = adminInfos.Count;
            test.data = adminInfos.Skip((page - 1)*limit).Take(limit).ToList();
        

            return Json(test,JsonRequestBehavior.AllowGet);

        }