• EasyUI分页兼条件查询


    //控制器
      public ActionResult GetAllUserInfo()
            {
                int pageIndex = Request["page"] == null ? 1 : int.Parse(Request["page"]);
                int pageSize = Request["rows"] == null ? 10 : int.Parse(Request["rows"]);
                int total = 0;
               var temp = userInfoService.Query(s => s.UserName != null);    
                
                //接收页面传过来的搜索条件
               string SearchName = Request["searchname"]; 
                if (SearchName!= null) { temp = userInfoService.Query(s => s.UserName.Trim() == SearchName); }
                          
                //真分页
                total = temp.Count();  
                var users = temp.OrderByDescending(s => s.UserId)
                         .Skip<UserInfo>((pageIndex - 1) * pageSize).Take<UserInfo>(pageSize);
                var data = new
                {
                    total = total,
                    rows = users.ToList<UserInfo>()
                 };
    
                  return Json(data);    
      
            }
    控制器
    <input id="searchname" type="text" name="searchname" /> <a href="javascript:void(0)" onclick="funsear();">查询</a>
        <script type="text/javascript">
            function funsear() {
                $('#test').datagrid('load', {
                    searchname: $('#searchname').val()
                    
                });
            }
        </script>
    页面输入

    注意1.

    <a href="javascript:void(0)" onclick="funsear();">查询</a>

    //将搜索框的值传到后台,根据条件搜索,再重新加载

    注意2.   

    $('#test').datagrid('load', {
    searchname: $('#searchname').val()
    });

    //这个load是EasyUI自带的“重新加载数据”

     $(function () {
            initTable();
        BindAddUserClickEvent();
        BindUpdateUserClickEvent();
    });
    
    
    
    
    //初始化表格
            function initTable() {
            $('#test').datagrid({
                title: '用户列表',
                iconCls: 'icon-user',
                loadMsg: '数据加载中...',
                nowrap: true,
                autoRowHeight: true,
                striped: true,
                url: '/User/GetAllUserInfo',
                sortName: 'UserId',
                sortOrder: 'asc',
                border: true,
                remoteSort: false,
                idField: 'UserId',
                pageSize: 10,
                pagination: true,
                rownumbers: true,
                columns: [[
                    { field: 'ck', checkbox: true },
                    { field: 'UserId', title: 'ID',  50, sortable: true },
                    { field: 'UserName', title: '用户名',  100, sortable: true },
                    { field: 'Phone', title: "电话",  150, sortable: true },
                    { field: 'PassWord', title: "密码",  150, sortable: true },
                    { field: 'Address', title: "地址",  150, sortable: true },
    
                    {
                        field: 'RegistrationTime', title: "注册时间",  150, sortable: true,
                        formatter: function (value, row, index) {
                            //return (eval(value.replace(//Date((d+))//gi, "new Date($1)"))).pattern("yyyy-M-d h:m:s");
                        }
                    },
                    { field: 'UserRoleId', title: "权限",  150, sortable: true },
                    {
                        field: 'Enable', title: '是否启用',   80, formatter: function (val, rowdata, index) {
                            if (val) {
                                return '<a class="grid_Enable" href="javascript:void(0)" >' + val + '</a>';
                            } else {
                                return '<a class="grid_unEnable" href="javascript:void(0)" >' + val + '</a>';
                            }
                        }
                    }
                ]],
                onLoadSuccess: function () {
                    $(".grid_Enable").linkbutton({ text: '启用', plain: true, iconCls: 'icon-ok' });
                    $(".grid_unEnable").linkbutton({ text: '禁止', plain: true, iconCls: 'icon-no' });
                },
                toolbar: [{
                    id: 'btnadd',
                    text: '添加用户',
                    iconCls: 'icon-add',
                    handler: function () {
                        AddUserDialog();
                    }
                }, '-', {
                    id: 'btnedit',
                    text: '修改用户',
                    iconCls: 'icon-edit',
                    handler: function () {
                        UpdateUserDialog();
                    }
                }, '-', {
                    id: 'btncut',
                    text: '删除用户',
                    iconCls: 'icon-cut',
                    handler: function () {
                        DeleteUser();
                    }
                }, '-', {
                    id: 'btnrefresh',
                    text: '刷新',
                        iconCls: 'icon-reload',
                    handler: function () {
                        initTable();
                    }
                }]
            });
    }
    EasyUI自带的datagrid

     

  • 相关阅读:
    .java中如何实现序列化,有什么意义
    缓存穿透
    缓存击穿
    缓存雪崩
    redis缓存预热
    Docket 的常用命令
    数据库优化方法
    servlet和jsp的区别:
    6原则1法则
    学习IntelliJ IDEA(二)模块
  • 原文地址:https://www.cnblogs.com/fzqm-lwz/p/10533979.html
Copyright © 2020-2023  润新知