ASP.net 用EasyUI datagrid对数据操作

来源:互联网 发布:labview 算编程吗 编辑:程序博客网 时间:2024/06/06 18:46

第一步:引用 <script type="text/javascript" src="/js/easyui.js"></script>和 <script type="text/javascript" src="/js/easyui-lang-zh_CN.js"></script>,下载地址http://download.csdn.net/detail/wu_jian_xiong/7610585也可以在我的博客中下载

第二步:写代码    function LoadGrid() {
         ///需要传到后台的值
        var xian = $("#drop_xian option:selected ").text() == "县" ? "" : $("#drop_xian option:selected ").text();
        var Meet_MN = "";
        if ($("#Drop_Name option:selected ").text() == "会议") {
            Meet_MN = $("#txt_meet").val();
        }

          //datas是一个<table>标签或则<div>标签
        $('#datas').datagrid({
            url: '/AjaxSource/xxx.ashx',/////url:是需要传输数据的地址,这个也可以是Json

            //下面4行是datagrid的属性,这些属性可以在http://www.cnblogs.com/Philoo/archive/2011/11/16/jeasyui_api_datagrid.html查看
            rownumbers: true,
            fitColumns: true, pageList: [5, 10, 15],
            pagination: true, striped: false,
            height: ($(window).height() * 0.90),

            ///queryParams 传输数据,opt读取的标记,值为Msearch
            queryParams: { "opt": "Msearch", "meet": encodeURI(Meet_MN),
                "Xian": encodeURI(xian),"sortOrder": "desc"//倒叙排列
            },
            columns: [[
                    { field: 'ck1', checkbox: true },//选择功能
                    { field: 'ID', title: '编号', width: 16, align: 'center', sortable: true },//根据ID 排序
            //                    { field: 'tu', title: '图', width: 30, align: 'center',
            //                        formatter: function (v, r, i) {
            //                            var s = ".." + r.ADURL;
            //                            if (s != "..") {
            //                                return "<img  ID='IgMeet_ADURL'  Width='100px'  height='25px' src='" + s + "'   style='cursor:pointer' alt='广告图' onclick='practice(" + r.ID + ")'/>";
            //                            }
            //                            return "";
            //                        }
            //                    },
           {field: 'MeetName', title: '会议', width: 50, align: 'center',
         formatter: function (v, r, i) {
               var meetname = r.MeetName;
               if (meetname.length > 9) {
                   meetname = meetname.substring(0, 9) + "...";
                   return "<table   style='width='100%'><tr><td ><a target='_blank' style='TEXT-DECORATION:none; float: left'  >" + meetname + "</a></d></tr></table>";
               }
               else if (meetname.length == 0) {
                   return " <table   style='width='100%'><tr><td ><a target='_blank' style='TEXT-DECORATION:none; float: left'    >未填</a></d></tr></table>"; //
               }
               else {
                   return " <table   style='width='100%'><tr><td ><a target='_blank' style='TEXT-DECORATION:none; float: left'   >" + r.MeetName + "</a></d></tr></table>"; //
               }
           }
       },
                    { field: 'Meet_Name', title: '会场', width: 50, align: 'center',
                        formatter: function (v, r, i) {
                            var meetname = r.Meet_Name;
                            if (meetname.length > 9) {
                                meetname = meetname.substring(0, 9) + "...";
                                return "<table   style='width='100%'><tr><td ><a target='_blank' style='TEXT-DECORATION:none; float: left'  >" + meetname + "</a></d></tr></table>";
                            }
                            else if (meetname.length == 0) {
                                return " <table   style='width='100%'><tr><td ><a target='_blank' style='TEXT-DECORATION:none; float: left'    >未填</a></d></tr></table>"; //
                            }
                            else {
                                return " <table   style='width='100%'><tr><td ><a target='_blank' style='TEXT-DECORATION:none; float: left'   >" + r.Meet_Name + "</a></d></tr></table>"; //
                            }
                        }
                    },
                    { field: 'Sheng', title: '省', width: 20, align: 'center' },
                    { field: 'Shi', title: '市', width: 20, align: 'center',
                        formatter: function (v, r, i) {
                            var shi = r.Shi;
                            if (shi.length > 4) {
                                shi = shi.substring(0, 4) + "..";
                                return "<a target='_blank' style='TEXT-DECORATION:none'  >" + shi + "</a>";
                            }
                            else if (shi.length == 0) {
                                return "<a target='_blank' style='TEXT-DECORATION:none'  >未填写</a>";
                            }
                            else {
                                return "<a target='_blank' style='TEXT-DECORATION:none' >" + r.Shi + "</a>";
                            }
                        }
                    },
                    { field: 'StartDate', title: '开始', width: 29, align: 'center',
                        formatter: function (value) {
                            if (value != null && value != '') {
                                if (value.indexOf('/') > 0) {
                                    value = value.replace("/", "-");
                                }
                                if (value.indexOf('/') > 0) {
                                    value = value.replace("/", "-");
                                }
                                return '<span title="' + TUJS.FormatDate(value, "quan") + '">' + TUJS.FormatDate(value, "NALL") + '</span>';
                            } else { return '--'; }
                        }
                    },


                    {field: 'HWJL', title: '会务经理', width: 30, align: 'center' },
                    { field: 'HWJLMobile', title: '手机', width: 32, align: 'center' },
                    { field: 'BMDocUrl', title: '报名表下载地址', width: 60, align: 'center',
                        formatter: function (v, r, i) {
                            var BMDocUrl = r.BMDocUrl;
                            return "<a target='_blank' style='TEXT-DECORATION:none'  href='" + BMDocUrl + "'>" + BMDocUrl + "</a>";
                        }
                    },
                     { field: 'order', title: '修改', width: 0, aliSSgn: 'center',
                         formatter: function (v, r, i) {
                             return "<img src='/icon/option.gif'  style='cursor:pointer' onclick='Update(" + r.ID + ")'/>";
                         }
                     },

         //判断时间是否在当天以后
        { field: 'up', title: '预定', width: 0, aliSSgn: 'center',
                formatter: function (v, r, i) {
                    if (r.StartDate == null || r.StartDate == "") {
                        return "--";
                    }
                    var myDate = new Date();
                    var month = myDate.getMonth() + 1;
                    var date = myDate.getFullYear() + "/" + month + "/" + myDate.getDate() + " " + myDate.getHours() + ":" + myDate.getMinutes() + ":" + myDate.getSeconds();
                    Date.prototype.diff = function (date) {
                        var star = parseInt((this.getTime() - date.getTime()) / (60 * 60 * 1000));
                        return star;
                    }
                    var dateA = new Date(r.StartDate);
                    var dateC = new Date(date);
                    var a = dateC.diff(dateA);
                    if (a <= 0) {
                        return "<img src='/images/yuding.gif'  style='cursor:pointer' onclick='Order(" + r.ID + ",\"" + r.MeetName + "\")'/>";
                    }
                    else {
                        return "--";
                    }
                }
            },
          { field: 'del', title: '删除', width: 0, align: 'center',
              formatter: function (v, r, i) {
                  return "<img src='/icon/del.gif' style='cursor:pointer' onclick='Del(" + r.ID + ")'>";
              }
          }
          ]],
            onSortColumn: function (sortname, order) {
                Sorts('datas', sortname, order);
            },
            onLoadSuccess: function (data) {
            },
            onLoadErrir: function (data) {
            },
            onDblClickRow: function (rowIndex, rowData) {
                seek(rowData.ID);//双击触发查看事件,可以不要
          }
        });
    }

   //排序
    function Sorts(datagridID, sortName, sortOrder) {
        var params = $('#' + datagridID).datagrid('options').queryParams;
        params.sortName = sortName;
        params.sortOrder = sortOrder;
        $("#" + datagridID).datagrid('reload');
    }

 ///批量删除
    function Dels() {
        var json = $('#datas').datagrid('getSelections'); var ids = ""
        if (json.length > 0) {
            $.each(json, function (i, n) {
                ids += n.ID + ",";
            });
        } else { return; };
        if (ids.length > 0) {
            Del(ids.substring(0, ids.length - 1));
        }
    }   

 //删除
    function Del(id) {
        var del = "删除";
        $.messager.confirm("删除", "确定删除么?", function (r) {
            if (r) {
                $.ajax({
                    type: 'POST', url: xxx.aspx?id=' + id + "&del=" + del,
                    success: function (data) {
                        var da = data;
                        var a = new Array();
                        a = da.split('<!');
                        if (a[0].toString().trim() == "1") {
                            Shows("温馨提示", "成功!", "slide", 5000);
                            LoadGrid();
                        }
                        else if (a[0].toString().trim() == "2") {
                            Shows("温馨提示", "还有订单存在,操作失败!", "slide", 5000);
                        }
                        else {
                            Shows("温馨提示", "失败", "slide", 5000);
                        }
                    }
                });
            }
        });
    }

 

第三部:AjaxSource/xxx.ashx后台代码

        public void ProcessRequest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            string opt = Decode("opt");   

 switch (opt)
            {
               case "Msearch":
                    rs = Mbin();
                    break;

            }

    context.Response.Write(rs);
            context.Response.Write(rs);
        }

      private string Mbin()
        {

         rs="";
        DataTable dt = ;//后天直接用数据库查询语言,查出数据,再放到DataTable里面。
          OPDTorJSON op = new OPDTorJSON();
                rs = op.ToJsonString(dt, counts);//返回的这个counts为数据库查询的条数,这个自己写
          }
            catch { }
            return rs;
        }

 

 

 

0 0
原创粉丝点击