溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

easyui datagrid 增刪改查

發(fā)布時(shí)間：2020-07-10 20:18:08 來源：網(wǎng)絡(luò) 閱讀：739 作者：fiybird 欄目：編程語言

前臺(tái)顯示頁面：grid.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>
    <title></title>
    <link href="easyui/css/themes/default/easyui.css" rel="stylesheet" type="text/css" />
    <link href="easyui/css/themes/icon.css" rel="stylesheet" type="text/css" />
    <link href="easyui/css/demo.css" rel="stylesheet" type="text/css" />
    <link href="easyui/css/dlg.css" rel="stylesheet" type="text/css" />
    <script src="easyui/js/jquery-1.8.2.min.js" type="text/javascript"></script>
    <script src="easyui/js/jquery.easyui.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("#tab").datagrid({
                title: "學(xué)生信息",
                iconCls: "icon-save",
                width: 600,
                height: 300,
                collapsible: true,
                autoRowHeight: true,
                striped: true,
                queryParams: { "action": "query" },
                url: "grid.ashx",
                frozenColumns: [[{ field: "chk", "checkbox": true}]],
                columns: [[
                    { field: 'JSON_no', title: "編號(hào)", width: 80 },
                    { field: 'JSON_name', title: "姓名", width: 100 },
                    { field: 'JSON_pwd', title: "密碼", width: 100 },
                    { field: 'JSON_sex', title: "性別", width: 100 },
                    { field: 'JSON_age', title: "年齡", width: 100 },
                    { field: 'JSON_address', title: "住址", width: 100 },
                    ]],
                //                toolbar:"#tool",
                toolbar:[{
id:'btnadd',
text:'添加',
iconCls:'icon-add',
handler:function(){
$('#btnsave').linkbutton('enable');
add_dg();
}
},{
id:'btnedit',
text:'編輯',
iconCls:'icon-edit',
handler:function(){
$('#btnsave').linkbutton('enable');
edit_dg();
}
},{
id:'btncut',
text:'刪除',
iconCls:'icon-no',
handler:function(){
$('#btnsave').linkbutton('enable');
dele_dg();
}
}],
                pagination: true,
                rownumbers: true,
                singleSelect:true
            });
            //////////////分頁//////////////////
            $("#tab").datagrid('getPager').pagination({
                beforePageText: '當(dāng)前第',
                afterPageText: '頁，共{pages}頁',
                displayMsg: ' 當(dāng)前顯示{from} - {to} 條記錄  共 {total}條記錄',
                pagesize: 10, //頁面大小
                pageList:[10,15,20,30]
            });
        })
        //////////////////////刪除/////////////////
        function dele_dg() {
            //**********返回選中的復(fù)選框,返回值是數(shù)組(object類型)
            var checked = $("#tab").datagrid('getChecked');
            if (checked[0] != null) {
                var v = '';
                for (var i = 0; i < checked.length; i++) {
                    v += checked[i].JSON_id + ',';
                }
                //************所有選中記錄的id和','組成的字符串
                var str = v.substring(0, v.length - 1);                  
                $.post("grid.ashx", {"action":"del", id: str }, function (data) {
                    $.messager.alert('提示', data, 'info', function () { $("#tab").datagrid("reload"); });
                });
            }
        }
        ////////////////////////////添加///////////////////
        function add_dg() {
            //*********************$('#fm')[0](轉(zhuǎn)化為dom對(duì)象)先重置表單以免編輯功能的影響
            $('#fm_dg')[0].reset();                   
            $('#dd_dg').show();
            $('#dd_dg').dialog({
                title: '記錄修改',
                width: 400,
                height: 200,
                closed: false,
                cache: false,
                modal: true,
                buttons: [{
                    text: '保存',
                    iconCls: 'icon-save',
                    handler: function () {
                        var param = $("#fm_dg").serialize();
                        //解決中文亂碼的
                       var params = decodeURIComponent(param, true);
                       $.post("grid.ashx", { "action": "add", data: params }, function (data) {
                           if (data == 'ok') {
                               $.messager.show({
                                   title: 'success',
                                   msg: '插入成功！'
                               });
                               $('#tab').datagrid('reload');
                           } else {
                               $.messager.show({
                                   title: 'Error',
                                   msg: '插入失敗！'
                               });
                           }
                           $('#tab').datagrid('reload');
                            $('#dd_dg').window('close');
                        });
                    }
                }, {
                    text: '關(guān)閉',
                    iconCls: 'icon-cancel',
                    handler: function () {
                        $('#dd_dg').window('close');
                    }
                }]
            });
        }
        /////////////////////////////修改//////////////////////////
        function edit_dg() {
            var selected = $('#tab').datagrid('getSelected');
            if (selected != null) {
                $('#dd_dg').show();
                //***********將表格中選中的一條記錄值傳到編輯窗口
                $('#id').val(selected.JSON_id);
                $("#no").val(selected.JSON_no);
                $('#name').val(selected.JSON_name);
                $('#pwd').val(selected.JSON_pwd);
                //顯示下拉框的選中項(xiàng)
                if (selected.JSON_sex == "男") {
                    $("#sex").find("option").eq(0).attr("selected", "selected");
                } else {
                    $("#sex").find("option").eq(1).attr("selected", "selected");
                }
                $('#age').val(selected.JSON_age);
                $('#address').val(selected.JSON_address);
                $('#dd_dg').dialog({
                    title: '記錄修改',
                    width: 400,
                    height: 200,
                    closed: false,
                    cache: false,
                    modal: true,//顯示遮罩層
                    buttons: [{
                        text: '保存',
                        iconCls: 'icon-save',
                        handler: function () {
                            var param = $("#fm_dg").serialize();
                            var params = decodeURIComponent(param, true);
                            $.post("grid.ashx", { "action":"edit",data:params}, function (data) {
                                if (data == 'ok') {
                                    $.messager.show({
                                        title: 'success',
                                        msg: '修改成功！'
                                    });
                                    $('#tab').datagrid('reload');
                                } else {
                                    $.messager.show({
                                        title: 'Error',
                                        msg: '修改失?。?
                                    });
                                }
                                $('#dg').datagrid('reload');
                                $('#dd_dg').window('close');
                            });
                        }
                    }, {
                        text: '關(guān)閉',
                        iconCls: 'icon-cancel',
                        handler: function () {
                            $('#dd_dg').window('close');
                        }
                    }]
                });
            }
        }
    </script>
</head>
<body>
<!-- datagrid -->
<table id="tab"></table>
<!-- 添加窗體 -->
<div id="dd_dg"  >
    <form id="fm_dg" method="post" action="grid.ashx">
        <input type="hidden" name="id" id="id"/>
        編號(hào):<input type="text" name="no" id="no" class="easyui-validatebox"  required="true"/><br/>
        姓名:<input type="text" name="name" id="name" class="easyui-validatebox"  required="true"/><br/>
        密碼:<input type="password" name="pwd" id="pwd" class="easyui-validatebox"  required="true"/><br/>
        性別:<select name="sex" id="sex">
                      <option value="1">男</option>
                      <option value="0">女</option>
                </select><br/>
        年齡:<input type="text" name="age" id="age" class="easyui-validatebox"  required="true"/><br/>
        住址:<input type="text" name="address" id="address" class="easyui-validatebox"  required="true"/><br/>
    </form>
</div>
</body>
</html>
//后臺(tái)數(shù)據(jù)處理頁面grid.ashx
public class grid : IHttpHandler
    {
        public void Proce***equest(HttpContext context)
        {
            context.Response.ContentType = "text/plain";
            string action = context.Request["action"].ToString();
            switch (action)
            {
                case "query":
                    Query();
                    break;
                case "del":
                    Del();
                    break;
                case "add":
                    Add();
                    break;
                case "edit":
                    Edit();
                    break;
            }
        }
        /// <summary>
        /// 查詢并分頁
        /// </summary>
        private void Query()
        {
            string str = string.Empty;
             string rows = HttpContext.Current.Request["rows"].ToString();  //獲取datagrid傳來的行數(shù)
            string page = HttpContext.Current.Request["page"].ToString(); //獲取datagrid傳來的頁碼 當(dāng)前頁
            // GetTablebyproc上篇文章的調(diào)用帶參數(shù)的存儲(chǔ)過程，返回datat
            DataTable dt1 = SqlHelper.GetTablebyproc("pageFileter", int.Parse(rows), int.Parse(page), "stu");
            DataTable dt = SqlHelper.GetTable("select * from stu");
            str = JSonHelper.CreateJsonParameters(dt1, true, dt.Rows.Count);
            HttpContext.Current.Response.Write(str);
        }
        /// <summary>
        /// 刪除一行數(shù)據(jù)
        /// </summary>
        private void Del()
        {
            string str = "刪除失敗";
            string id = HttpContext.Current.Request["id"] != "" ? HttpContext.Current.Request["id"].ToString() : "";
            if (id != string.Empty)
            {
                int num = SqlHelper.DelData("stu", id);
                if (num > 0)
                {
                    str = string.Format("刪除成功，本次共刪除{0}條", num.ToString());
                }
                else
                {
                    str = "刪除失敗";
                }
            }
            HttpContext.Current.Response.Write(str);
        }
        /// <summary>
        /// 添加一條數(shù)據(jù)
        /// </summary>
        private void Add()
        {
            StringBuilder sb = new StringBuilder();
            foreach (string s in HttpContext.Current.Request.Form.AllKeys)
            {
                sb.AppendFormat("{0}: {1}\n", s, HttpContext.Current.Request.Form[s]);
            }
            string str = sb.ToString();
            string[] str1 = str.Split('&');
            string no = str1[1].Split('=')[1];
            string name = str1[2].Split('=')[1];
            string pwd = str1[3].Split('=')[1];
            string sex = str1[4].Split('=')[1]=="1"?"男":"女";
            int age = int.Parse(str1[5].Split('=')[1]);
            string add = str1[6].Split('=')[1];
            string address = add.Substring(0, add.Length - 1);
            string sql = string.Format("insert into stu values('{0}','{1}','{2}','{3}',{4},'{5}')", no, name, pwd, sex, age, address);
            int count = 0;
            count = SqlHelper.ExeNonQuery(sql, CommandType.Text, null) ? 1 : 0;
            if (count > 0)
            {
                HttpContext.Current.Response.Write("ok");
            }
            else
            {
                HttpContext.Current.Response.Write("no");
            }
        }
        /// <summary>
        /// 修改一條數(shù)據(jù)
        /// </summary>
        private void Edit()
        {
            StringBuilder sb = new StringBuilder();
            foreach (string s in HttpContext.Current.Request.Form.AllKeys)
            {
                sb.AppendFormat("{0}: {1}\n", s, HttpContext.Current.Request.Form[s]);
            }
            string str = sb.ToString();
            string[] str1 = str.Split('&');
            int id = int.Parse(str1[0].Split('=')[1]);
            string no = str1[1].Split('=')[1];
            string name = str1[2].Split('=')[1];
            string pwd = str1[3].Split('=')[1];
            string sex = str1[4].Split('=')[1] == "1" ? "男" : "女";
            int age = int.Parse(str1[5].Split('=')[1]);
            string add = str1[6].Split('=')[1];
            string address = add.Substring(0, add.Length - 1);
            string sql = string.Format("update stu set no='{0}',name='{1}',pwd='{2}',sex='{3}',age={4},address='{5}' where id={6}", no, name, pwd, sex, age, address, id);
            int count = 0;
            count = SqlHelper.ExeNonQuery(sql, CommandType.Text, null) ? 1 : 0;
            if (count > 0)
            {
                HttpContext.Current.Response.Write("ok");
            }
            else
            {
                HttpContext.Current.Response.Write("no");
            }
        }


向AI問一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場，如果涉及侵權(quán)請(qǐng)聯(lián)系站長郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手