zoukankan      html  css  js  c++  java
  • easyui 通用的datagrid中如何带有查询条件分页

    html 代码

     
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head id="Head1"><title>
     
    </title>
        <script type="text/javascript" language="javascript" src="../Scripts/My97DatePicker/WdatePicker.js"></script>
        <link rel="stylesheet" type="text/css" href="../Scripts/jquery-easyui-1.3.2/themes/default/easyui.css" /><link rel="stylesheet" type="text/css" href="../Scripts/jquery-easyui-1.3.2/themes/icon.css" />
        <script type="text/javascript" src="../Scripts/jquery-easyui-1.3.2/jquery-1.8.0.min.js"></script>
        <script type="text/javascript" src="../Scripts/jquery-easyui-1.3.2/jquery.easyui.min.js"></script>
        <link rel="stylesheet" type="text/css" href="../Resource/Css/base.css" />
    </head>
    <body>
        <form method="post" action="orders.aspx" id="form1">
    <div class="aspNetHidden">
    <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTExNjk2ODg0NDRkZCOLvqGWle7VDdkjq2dhN5yAxw6yEAPsgqeeG/+Wi49/" />
    </div>
     
    <div class="aspNetHidden">
     
        <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWBALt0qRkApehh7YHAq/J98ULAvDVkOYC1D/zVz5bLUZLledrbR3qxiF16rmEfvZBJPE413rxsnU=" />
    </div>
                
        <script type="text/javascript">
            $(function () {
                $('#dataList').datagrid({
                    title: '订单查询',
                    iconCls: 'icon-save',
                     2000,
                    height: window.screen.height * 0.8,
                    fit: false,
                    nowrap: false,
                    striped: true,
                    url: '../jsonData/orders.ashx',
                    sortName: 'ids',
                    sortOrder: 'ids',
                    remoteSort: false,
                    idField: 'ids',
                    frozenColumns: [[
                       { field: 'ck', checkbox: true },
                        { title: '订单号', field: 'order_no',  100, sortable: true },
                        { title: '订单状态', field: 'order_status',  80, sortable: true }
                    
                    ]],
                    columns: [[
                       
                        { title: '产品总额', field: 'product_total_cost',  60, sortable: true },
                        {title: '订单备注', field: 'remark',  100, sortable: true }
     
                    ]],
                    onHeaderContextMenu: function (e, field) {
                        e.preventDefault();
                        if (!$('#tmenu').length) {
                            createColumnMenu();
                        }
                        $('#tmenu').menu('show', {
                            left: e.pageX,
                            top: e.pageY
                        });
                    },
                    pagination: true,
                    rownumbers: true,
                    toolbar: [{
                        id: 'btnadd',
                        text: '添加',
                        iconCls: 'icon-add',
                        handler: function () {
                            $('#btnsave').linkbutton('enable');
                            alert('add')
                        }
                    }, {
                        id: 'btncut',
                        text: '删除',
                        iconCls: 'icon-cut',
                        handler: function () {
                            $('#btnsave').linkbutton('enable');
                            alert('cut')
                        }
                    }, '-', {
                        id: 'btnsave',
                        text: '保存',
                        disabled: true,
                        iconCls: 'icon-save',
                        handler: function () {
                            $('#btnsave').linkbutton('disable');
                            alert('save')
                        }
                    }]
                });
                var p = $('#dataList').datagrid('getPager');
                if (p) {
                    $(p).pagination({
                        pageSize: 10, //每页显示的记录条数,默认为10   
                        pageList: [5, 10, 15], //可以设置每页记录条数的列表   
                        beforePageText: '第', //页数文本框前显示的汉字   
                        afterPageText: '页    共 {pages} 页',
                        displayMsg: '当前显示 {from} - {to} 条记录   共 {total} 条记录',
                        onBeforeRefresh: function (pageNumber, pageSize) {
                            alert('pageNumber:' + pageNumber + ',pageSize:' + pageSize);
                            alert('before refresh');
                        }
                    });
                }
     
            });
     
            function createColumnMenu() {
                var tmenu = $('<div id="tmenu" style="100px;"></div>').appendTo('body');
                var fields = $('#dataList').datagrid('getColumnFields');
                for (var i = 0; i < fields.length; i++) {
                    $('<div iconCls="icon-ok"/>').html(fields[i]).appendTo(tmenu);
                }
                tmenu.menu({
                    onClick: function (item) {
                        if (item.iconCls == 'icon-ok') {
                            $('#dataList').datagrid('hideColumn', item.text);
                            tmenu.menu('setIcon', {
                                target: item.target,
                                iconCls: 'icon-empty'
                            });
                        } else {
                            $('#dataList').datagrid('showColumn', item.text);
                            tmenu.menu('setIcon', {
                                target: item.target,
                                iconCls: 'icon-ok'
                            });
                        }
                    }
                });
            }
     
            function resize() {
                $('#dataList').datagrid('resize', {
                     700,
                    height: 400
                });
            }
            function showDate(val) {
                if (val != null) {
                    val = val.replace("/Date(", "");
                    val = val.replace(")/", "");
                    dt = new Date(Number(val));
                    return dt.toLocaleString();
                } else {
                    return "";
                }
            }
            function getProduct(val) {
                var start = val.indexOf("产品属性");
                if (start > 8) {
                    start = start - 8;
                }
                return val.substr(start);
            }
     
            function FindData() {
                $('#dataList').datagrid('load', {
                    order_no: $('#order_no').val()
                }
             );
            } 
     
        </script>
        <div id="searchtool" style="padding: 5px">
            <span>订单号:</span><input name="ctl00$ContentPlaceHolder1$order_no" type="text" id="order_no" />
            <a href="javascript:FindData()" class="easyui-linkbutton" data-options="iconCls:'icon-search'">
                查询</a>
            </div>
                <table id="dataList">
                </table>
     
        </form>
    </body>
    </html>


    后台代码

    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Web;
    using System.Web.UI;
    using System.Web.UI.WebControls;
    using System.IO;
    using System.Text;
    using ySmtHelper.Common;
    using System.Data.Linq;
    using System.Web.Script.Serialization;
    
    namespace ySmtHelper.jsonData
    {
        /// <summary>
        /// Summary description for orders
        /// </summary>
        public class orders : IHttpHandler
        {
    
            public void ProcessRequest(HttpContext context)
            {
                int page = 0;
                if (context.Request.QueryString["page"] != null)
                {
                    page = Convert.ToInt32(context.Request.QueryString["page"].ToString());
                }
                if (context.Request.Form["page"] != null)
                {
                    page =Convert.ToInt32( context.Request.Form["page"].ToString());
                }
                int rows = 0;
                if (context.Request.QueryString["rows"] != null)
                {
                    rows =Convert.ToInt32( context.Request.QueryString["rows"].ToString());
                }
                if (context.Request.Form["rows"] != null)
                {
                    rows = Convert.ToInt32(context.Request.Form["rows"].ToString());
                }
                context.Response.ContentType = "text/plain";
                //tb_order entry = new tb_order();
                //entry.buyer_name = "buyer_name";
                //entry.order_no = "order_no";
                //entry.order_time = DateTime.Now;
                JavaScriptSerializer serializer = new JavaScriptSerializer();
                //序列化
                //string json = serializer.Serialize(entry);
                //反序列化
                //tb_order tb_order = serializer.Deserialize<tb_order>(json);
             //   context.Response.Write(json);
                context.Response.Write(BindGrid( context, page, rows));
            }
    
            public string BindGrid(HttpContext context,int pageIndex, int pageSize)
            {          
                if (pageIndex < 1)
                {
                    pageIndex = 1;
                }
                int totalcount = 0;
                string out_s = "";
    
                using (SmtDataContext db = new SmtDataContext())
                {
                    using (var writer = File.AppendText(Log.getLogFile()))
                    {
                        db.Log = writer;
                        var loadOptions = new DataLoadOptions();
                        db.LoadOptions = loadOptions;
                        string orderby = "order_no";
    
                            var q_count = from c in db.tb_orders select c;
    
                            if (context.Request.Form["order_no"] != null && context.Request.Form["order_no"].Length>0)
                            {
                                q_count = q_count.Where(p => p.order_no.Contains(context.Request.Form["order_no"].ToString()));
                            }
    
                            totalcount = q_count.Count();
                            //Skip(100)代表跳过100行后.从第101行开始分页;
                            //take(10)表示多少行分页;
                            // 第一种                    var aClass = q_count.OrderBy(p => GetPropertyValue(p, orderBy.SelectedValue.Trim())).Skip((pageIndex - 1) * pageSize).Take(pageSize);
                            // 第2种
                            var aClass = LinqOrderBy.OrderByDescending(q_count, orderby).Skip((pageIndex - 1) * pageSize).Take(pageSize);
                            JavaScriptSerializer serializer = new JavaScriptSerializer();
                            string json = serializer.Serialize(aClass);
                        //easyui 格式        {  "total":239, "rows":[ {"code":"010","name":"Name 10"} ]}    
                             StringBuilder sb = new StringBuilder();
                             sb.Append("{ "total":" + totalcount + ", "rows":" + json + "}");
                             out_s = sb.ToString();
                            writer.Close();
                    }
                }
                return out_s;
            }
    
            public bool IsReusable
            {
                get
                {
                    return false;
                }
            }
        }
    }
    
  • 相关阅读:
    Unsupported major.minor version 51.0(JDK版本错误)
    String、StringBuilder和StringBuffer的区别
    循环依赖常问问题,spring三级缓存解决循环依赖解析图
    ens33网卡失效ipaddr查询不到ip: 出现:ens33: <BROADCAST,MULTICAST> mtu 1500 qdisc noop state DOWN group default qlen 1000 link/ether 00:0c:29:2c:8d:e1 brd ff:ff:ff:ff:ff:ff
    redis被攻击,导致redis连接不上,RDB异常解决方案
    项目集成seata和mybatisplus冲突问题解决方案:(分页插件失效, 自动填充失效, 自己注入的id生成器失效 找不到mapper文件解决方案)
    seata服务端搭建和客户端配置(使用nacos进行注册发现,使用mysql进行数据持久化),以及过程中可能会出现的问题与解决方案
    通过串口(蓝牙WiFi)与Arduino通信
    Python callable函数判断某个对象是否可调用
    Python 通过PyUserInput模拟键鼠操作
  • 原文地址:https://www.cnblogs.com/xinyaoxp/p/3205025.html
Copyright © 2011-2022 走看看