EasyUI C# DataGrid 行内编辑

19 篇文章 0 订阅

<link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css"/>
<link rel="stylesheet" type="text/css" href="easyui/themes/icon.css"/>
<link rel="stylesheet" type="text/css" href="easyui/demo/demo.css"/>
<script type="text/javascript" src="easyui/jquery.min.js"></script>
<script type="text/javascript" src="easyui/jquery.easyui.min.js" charset="utf-8"></script>
<script type="text/javascript" src="easyui/jquery.edatagrid.js"></script>
<script type="text/javascript" src="easyui/locale/easyui-lang-zh_CN.js"></script>


<script type="text/javascript">
    $(function () {
        $('#dg').edatagrid({
            url: 'Controller.ashx?method=query',
            saveUrl: 'Controller.ashx?method=add',
            updateUrl: 'Controller.ashx?method=edit',
            destroyUrl: 'Controller.ashx?method=delete'
        });
    });
</script>
</head>
<body>
    <table id="dg" title="My Users" style="width:550px;height:250px"
        toolbar="#toolbar" idField="id"
        rownumbers="true" fitColumns="true" singleSelect="true">
    <thead>
        <tr>
            <th field="id" width="50" editor="{type:'validatebox',options:{readonly:true}}">id</th>
            <th field="name" width="50" editor="{type:'validatebox',options:{required:true}}">name</th>
            <th field="url" width="50"  editor="{type:'validatebox',options:{required:true}}">url</th>
            <th field="alexa" width="50" editor="{type:'validatebox',options:{validType:'integer',required:true}}">alexa</th>
        </tr>       <!--validType:['email','length[0,20]']-->
    </thead>
</table>
<div id="toolbar">
    <a href="#" class="easyui-linkbutton" iconCls="icon-add" plain="true" οnclick="javascript:$('#dg').edatagrid('addRow')">New</a>
    <a href="#" class="easyui-linkbutton" iconCls="icon-remove" plain="true" οnclick="javascript:$('#dg').edatagrid('destroyRow')">Destroy</a>
    <a href="#" class="easyui-linkbutton" iconCls="icon-save" plain="true" οnclick="javascript:$('#dg').edatagrid('saveRow')">Save</a>
    <a href="#" class="easyui-linkbutton" iconCls="icon-undo" plain="true" οnclick="javascript:$('#dg').edatagrid('cancelRow')">Cancel</a>
</div>
</body>
</html>

 


(function ($) {

    /**
     *
     * @requires jQuery,EasyUI
     *
     * 扩展validatebox,添加验证两次密码功能
     */
    $.extend($.fn.validatebox.defaults.rules, {
        eqPwd: {
            validator: function (value, param) {
                return value == $(param[0]).val();
            },
            message: '密码不一致!'
        },
        idcard: {// 验证身份证
            validator: function (value) {
                return /^\d{15}(\d{2}[A-Za-z0-9])?$/i.test(value);
            },
            message: '身份证号码格式不正确'
        },
        minLength: {
            validator: function (value, param) {
                return value.length >= param[0];
            },
            message: '请输入至少(2)个字符.'
        },
        length: {
            validator: function (value, param) {
                var len = $.trim(value).length;
                return len >= param[0] && len <= param[1];
            },
            message: "输入内容长度必须介于{0}和{1}之间."
        },
        phone: {// 验证电话号码
            validator: function (value) {
                return /^((\(\d{2,3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/i.test(value);
            },
            message: '格式不正确,请使用下面格式:010-88888888'
        },
        mobile: {// 验证手机号码
            validator: function (value) {
                return /^(13|15|18)\d{9}$/i.test(value);
            },
            message: '手机号码格式不正确'
        },
        intOrFloat: {// 验证整数或小数
            validator: function (value) {
                return /^\d+(\.\d+)?$/i.test(value);
            },
            message: '请输入数字,并确保格式正确'
        },
        currency: {// 验证货币
            validator: function (value) {
                return /^\d+(\.\d+)?$/i.test(value);
            },
            message: '货币格式不正确'
        },
        qq: {// 验证QQ,从10000开始
            validator: function (value) {
                return /^[1-9]\d{4,9}$/i.test(value);
            },
            message: 'QQ号码格式不正确'
        },
        integer: {// 验证整数
            validator: function (value) {
                return /^[+]?[1-9]+\d*$/i.test(value);
            },
            message: '请输入整数数字'
        },
        age: {// 验证年龄
            validator: function (value) {
                return /^(?:[1-9][0-9]?|1[01][0-9]|120)$/i.test(value);
            },
            message: '年龄必须是0到120之间的整数'
        },
        chinese: {// 验证中文
            validator: function (value) {
                return /^[\Α-\¥]+$/i.test(value);
            },
            message: '请输入中文'
        },
        english: {// 验证英语
            validator: function (value) {
                return /^[A-Za-z]+$/i.test(value);
            },
            message: '请输入英文'
        },
        unnormal: {// 验证是否包含空格和非法字符
            validator: function (value) {
                return /.+/i.test(value);
            },
            message: '输入值不能为空和包含其他非法字符'
        },
        username: {// 验证用户名
            validator: function (value) {
                return /^[a-zA-Z][a-zA-Z0-9_]{5,15}$/i.test(value);
            },
            message: '用户名不合法(字母开头,允许6-16字节,允许字母数字下划线)'
        },
        faxno: {// 验证传真
            validator: function (value) {
                return /^((\(\d{2,3}\))|(\d{3}\-))?(\(0\d{2,3}\)|0\d{2,3}-)?[1-9]\d{6,7}(\-\d{1,4})?$/i.test(value);
            },
            message: '传真号码不正确'
        },
        zip: {// 验证邮政编码
            validator: function (value) {
                return /^[0-9]\d{5}$/i.test(value);
            },
            message: '邮政编码格式不正确'
        },
        ip: {// 验证IP地址
            validator: function (value) {
                return /d+.d+.d+.d+/i.test(value);
            },
            message: 'IP地址格式不正确'
        },
        name: {// 验证姓名,可以是中文或英文
            validator: function (value) {
                return /^[\Α-\¥]+$/i.test(value) | /^\w+[\w\s]+\w+$/i.test(value);
            },
            message: '请输入姓名'
        },
        msn: {
            validator: function (value) {
                return /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/.test(value);
            },
            message: '请输入有效的msn账号(例:abc@hotnail(msn/live).com)'
        }
    });

    /**
     *
     * @requires jQuery,EasyUI
     *
     * 扩展tree,使其支持平滑数据格式
     */
    $.fn.tree.defaults.loadFilter = function (data, parent) {
        var opt = $(this).data().tree.options;
        var idFiled, textFiled, parentField;
        if (opt.parentField) {
            idFiled = opt.idFiled || 'id';
            textFiled = opt.textFiled || 'text';
            parentField = opt.parentField;
            var i, l, treeData = [], tmpMap = [];
            for (i = 0, l = data.length; i < l; i++) {
                tmpMap[data[i][idFiled]] = data[i];
            }
            for (i = 0, l = data.length; i < l; i++) {
                if (tmpMap[data[i][parentField]] && data[i][idFiled] != data[i][parentField]) {
                    if (!tmpMap[data[i][parentField]]['children'])
                        tmpMap[data[i][parentField]]['children'] = [];
                    data[i]['text'] = data[i][textFiled];
                    tmpMap[data[i][parentField]]['children'].push(data[i]);
                } else {
                    data[i]['text'] = data[i][textFiled];
                    treeData.push(data[i]);
                }
            }
            return treeData;
        }
        return data;
    };
})(jQuery);

 

 

 

 public class Controller : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            String method = context.Request.Params.Get("method");
            if (method == "query")
            {
                getData(context);
            }
            else if (method == "add")
            {
              //  String id = context.Request.Form["id"].ToString();
                String name = context.Request.Form["name"].ToString();
                String url = context.Request.Form["url"].ToString();
                String alexa = context.Request.Form["alexa"].ToString();
                String sql = "insert into websites values(null,'" + name + "','" + url + "','" + alexa + "')";
                addData(context, sql);
                JavaScriptSerializer jsSerializer = new JavaScriptSerializer();

                context.Response.Write(jsSerializer.Serialize("添加成功"));
                context.Response.End();
            }
            else if (method == "edit")
            {
                String id = context.Request.Form["id"].ToString();
                String name = context.Request.Form["name"].ToString();
                String url = context.Request.Form["url"].ToString();
                String alexa = context.Request.Form["alexa"].ToString();
                String sql = "update websites set name='" + name + "',url='" + url + "', alexa='" + alexa + "' where id='" + id + "'";
                editData(context, sql);
                JavaScriptSerializer jsSerializer = new JavaScriptSerializer();
                Dictionary<String, String> map = new Dictionary<string, string>();
                map.Add("success","成功");
                map.Add("error", "失败");

                context.Response.Write(jsSerializer.Serialize(map));
                context.Response.End();
            }
            else if (method == "delete")
            {
                Dictionary<String, String> map = new Dictionary<string, string>();
                JavaScriptSerializer jsSerializer = new JavaScriptSerializer();
                try
                {
                    String id = context.Request.Form["id"].ToString();
                    String sql = "delete from websites where id=" + id;
                    connectDB cd = new connectDB();
                    cd.executeNoQuery(sql);
                    map.Add("success", "成功");
                    context.Response.Write(jsSerializer.Serialize(map));
                    HttpContext.Current.ApplicationInstance.CompleteRequest();

                }
                catch (Exception e)
                {
                    map.Add("error", e.Message.ToString());
                    context.Response.Write(jsSerializer.Serialize(map));
                    HttpContext.Current.ApplicationInstance.CompleteRequest();
                }
                
            }

        }
        public void addData(HttpContext context,String sql)
        {
            connectDB cd = new connectDB();
            cd.executeNoQuery(sql);
        }
        public void editData(HttpContext context, String sql)
        {
            connectDB cd = new connectDB();
            cd.executeNoQuery(sql);
        }
        public void getData(HttpContext context)
        {
            connectDB cd = new connectDB();
            DataTable dt = cd.executeDataTable("select id,name,url,alexa from websites");

            List<Dictionary<string, string>> list = new List<Dictionary<string, string>>();
            for (int i = 0; i < dt.Rows.Count; i++)
            {
                Dictionary<string, string> d = new Dictionary<string, string>();
                for(int j=0;j<dt.Columns.Count;j++)
                {
                    d.Add(dt.Columns[j].ColumnName,dt.Rows[i][j].ToString());
                }
                list.Add(d);
            }
            
           // string commentsJson = DataTableToJsonWithJavaScriptSerializer(dt);
            JavaScriptSerializer jsSerializer = new JavaScriptSerializer();
            string commentsJson = jsSerializer.Serialize(list);

            context.Response.Write(commentsJson);
            //  context.Response.End();
        }
        public string DataTableToJsonWithJavaScriptSerializer(DataTable table)
        {

            JavaScriptSerializer jsSerializer = new JavaScriptSerializer();

            List<Dictionary<string, object>> parentRow = new List<Dictionary<string, object>>();

            Dictionary<string, object> childRow;

            foreach (DataRow row in table.Rows)
            {

                childRow = new Dictionary<string, object>();

                foreach (DataColumn col in table.Columns)
                {

                    childRow.Add(col.ColumnName, row[col]);

                }

                parentRow.Add(childRow);

            }

            return jsSerializer.Serialize(parentRow);

        }
        public void Alert(string message, HttpContext context)
        {
            string js = @"<Script language='JavaScript'>
                    alert('" + message + "');</Script>";
            context.Response.Write(js);
        }
        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }

 

 

 

 

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值