EasyUI DataGrid 實用例子(2015-05-22)

代碼經過精心改良,可以直接使用,具體看註釋吧.
1,前臺,代碼如下:
    
   <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="LineInfoManagement.aspx.cs" Inherits="LMX.XiAnPeiHua.Web.Admin.UnitManagement.LineInfoManagement" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>線路信息設置</title>
    <script src="/js/jquery-1.7.1.min.js"></script>
    <script src="/js/jquery-easyui-1.4.2/jquery.easyui.min.js"></script>
    <script src="/js/jquery-easyui-1.4.2/locale/easyui-lang-zh_CN.js"></script>
    <link href="/js/jquery-easyui-1.4.2/themes/metro-blue/easyui.css" rel="stylesheet" />
    <link href="/js/jquery-easyui-1.4.2/themes/icon.css" rel="stylesheet" />
    <link href="/css/style.css" rel="stylesheet" />
    <link href="/css/admin.css" rel="stylesheet" />
    <script type="text/javascript">
        $(document).ready(function () {
            fLoadTable();//加載參數
            $('#tt').datagrid('reload', {
                Method: 'FirstLoad'
            });
            $('#unit_id').combobox({
                onSelect: function (rec) {
                    //alert(rec.ID);
                    //$('#site_id').combobox('reload', location.href + '?type=LoadSite&UnitID=' + rec.ID);
                    var vUrl = '/Admin/UnitManagement/LineInfoManagement.aspx?type=LoadSite&UnitID=' + rec.ID;
                    $('#site_id').combobox({
                        url: vUrl,
                        onLoadSuccess: function () {
                            var data = $('#site_id').combobox('getData');
                            if (data.length > 0) {
                                $('#site_id').combobox('select', data[0].ID);
                            }
                            else {
                                $('#site_id').combobox('clear');
                            }
                        }
                    })
                }
            });
        })
        function fLoadTable() {
            $('#tt').datagrid({
                title: '',
                url: location.href,
                pagination: true,
                pageSize: 20,
                pagePosition: 'top',
                striped: true,
                //singleSelect: true,
                ctrlSelect: true,//在啓用多行選擇的時候允許使用Ctrl鍵+鼠標點擊的方式進行多選操作。
                rownumbers: true,
                columns: [[
                    { field: 'unit_id', title: 'unit_id', align: 'center', hidden: true },
                    { field: 'site_id', title: 'site_id', align: 'center', hidden: true },
                    { field: 'line_id', title: 'line_id', align: 'center', hidden: true },
                    { field: 'ckey', title: '線路編號', align: 'center' },
                    { field: 'name', title: '線路名稱', align: 'center' },
                    { field: 'remark', title: '備註', align: 'center' }
                ]],
                toolbar: [{
                    text: '增加',
                    iconCls: 'icon-add',
                    handler: function () {
                        $('#dlg').dialog('open').dialog('setTitle''新增線路信息');
                        $('#dlg_form').form('clear');
                        $('#unit_id').combo('readonly'false);    // 禁用只讀模式
                        $('#site_id').combo('readonly'false);    // 禁用只讀模式
                        $('#unit_id').combobox('reload''/Admin/UnitManagement/LineInfoManagement.aspx?type=LoadUnit');
                        vUrl = '/Admin/UnitManagement/LineInfoManagement.aspx?type=add';
                    }
                }, {
                    text: '修改',
                    iconCls: 'icon-edit',
                    handler: function () {
                        var row = $('#tt').datagrid('getSelected');
                        if (row) {
                            $('#dlg').dialog('open').dialog('setTitle''修改線路信息');
                            $('#unit_id').combobox('reload''/Admin/UnitManagement/LineInfoManagement.aspx??type=LoadUnit');
                            $('#site_id').combobox('reload''/Admin/UnitManagement/LineInfoManagement.aspx?type=LoadSite');
                            $('#dlg_form').form('load', row);
                            $('#unit_id').val(row.unit_id);
                            $('#site_id').val(row.line_id);
                            $('#ckeyPre').val(row.site_id);
                            $('#unit_id').combo('readonly'true);    // 啓用只讀模式
                            $('#site_id').combo('readonly'true);    // 啓用只讀模式
                            vUrl = '/Admin/UnitManagement/LineInfoManagement.aspx?type=modify&line_id=' + row.line_id;
                        } else {
                            $.messager.alert('請至少選中一項作爲修改項.')
                        }
                    }
                }, '-', {
                    text: '刪除',
                    iconCls: 'icon-remove',
                    handler: function () {
                        var row = $('#tt').datagrid('getSelected');
                        if (row) {
                            $.messager.confirm('提示''您確定要刪除這個線路信息嗎?'function (r) {
                                if (r) {
                                    vUrl = '/Admin/UnitManagement/LineInfoManagement.aspx?type=del&site_id=' + row.site_id + '&unit_id=' + row.unit_id + '&line_id=' + row.line_id;
                                    $.ajax({
                                        type: "POST",
                                        url: vUrl,
                                        success: function (json) {
                                            var json = eval('(' + json + ')');
                                            if (json.result == true) {
                                                $.messager.show({
                                                    title: 'Success',
                                                    msg: '刪除成功!'
                                                });
                                                $('#dlg').dialog('close');
                                                // close the dialog
                                                $('#tt').datagrid('reload'); // reload the user data
                                            } else {
                                                $.messager.show({
                                                    title: 'Error',
                                                    msg: '刪除失敗,請稍後再試!'
                                                });
                                                $('#dlg').dialog('close');
                                                // close the dialog
                                                $('#tt').datagrid('reload'); // reload the user data
                                            }
                                        }
                                    });
                                }
                            });
                        }
                        else {
                           $.messager.alert("請至少選中一項作爲刪除項");
                        }
                    }
                }]
            });
        };
        function fSaveData() {
            $('#dlg_form').form('submit', {
                url: vUrl,
                onSubmit: function () {
                    return $(this).form('validate');
                },
                success: function (sjson) {
                    var json = eval('(' + sjson + ')');
                    if (json.result == true) {
                        $.messager.show({
                            title: 'Success',
                            msg: json.msg ? json.msg : '操作成功!'
                        });
                        $('#dlg').dialog('close');     // close the dialog
                        $('#tt').datagrid('reload'); // reload the user data
                    } else {
                        $.messager.show({
                            title: 'Error',
                            msg: json.msg ? json.msg : '操作失敗,請稍後再試!'
                        });
                        $('#dlg').dialog('close');     // close the dialog
                    }
                },
                error: function () {
                    $.messager.show({
                        title: 'Error',
                        msg: json.msg ? json.msg : '操作失敗,請稍後再試!'
                    });
                    $('#dlg').dialog('close');     // close the dialog
                }
            });
        }
    </script>
</head>
<body>
    <div class="divForTable">
        <table id="tt" style="width: 100%; height: 600px; $(this).width() * 0.2;">
        </table>
    </div>
    <div id="dlg" class="easyui-dialog" style="width: 300px; height: 350px; padding: 5px 10px"
        data-options="closed:true,buttons:'#dlg-buttons',modal:true">
        <form id="dlg_form" method="post">
            <div class="fitem">
                <label>所屬電網:</label>
                <input id="unit_id" name="unit_id" class="easyui-combobox" required="true" data-options="valueField:'ID',textField:'Name',editable:false" />
            </div>
            <div class="fitem">
                <label>所屬變電所:</label>
                <input id="site_id" name="site_id" class="easyui-combobox" required="true" data-options="valueField:'ID',textField:'Name',editable:false" />
            </div>
            <%-- <div class="fitem">
                <label>線路編號:</label>
                <input name="ckeyPre" id="ckeyPre" class="easyui-validatebox" readonly="true" style="width: 30px;" />
            </div>--%>
            <div class="fitem">
                <label>名稱:</label>
                <input name="name" id="name" class="easyui-validatebox" required="true" />
            </div>
            <div class="fitem">
                <label>備註:</label>
                <input name="remark" id="remark" class="easyui-validatebox" />
            </div>
            <div class="line" style="margin-top: 15px;">
                說明:線路編號由8位數字組成,前5位是所屬變電所編號,最後3位代表線路內部編號.(編號在前端不顯示,後臺自動添加)
            </div>
        </form>
    </div>
    <div id="dlg-buttons">
        <a href="javascript:void(0)" class="easyui-linkbutton" iconcls="icon-ok" onclick="fSaveData()">保存
        </a>
        <a href="javascript:void(0)" class="easyui-linkbutton" iconcls="icon-cancel"
            onclick="javascript:$('#dlg').dialog('close')">取消
        </a>
    </div>
</body>
</html>

2,後臺代碼如下:
       protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                if (Request.QueryString["from"] == "LoadF_ParentItemCode")
                {
                    using (item_energyEntities ent = new item_energyEntities())
                    {
                        List<t_dt_energyitemdict> list = (from c in ent.t_dt_energyitemdict where c.F_EnergyItemType == "A" select c).ToList();
                        if (list != null && list.Count != 0)
                        {
                            var vData = from m in list select new { ID = m.F_EnergyItemCode, Name = m.F_EnergyItemName };
                            Response.Write(JsonHelper.Serialize(vData));
                        }
                        else
                        {
                            Response.Write(null);
                        }
                        Response.End();
                    }
                }
                if (Request.Form["Method"] == "FirstLoad")
                {
                    List<t_dt_energyitemdict> list = DataLoader.GetEnergyItemList();
                    int page = string.IsNullOrWhiteSpace(Request["page"]) ? 1 : Int32.Parse(Request["page"]);
                    int rows = string.IsNullOrWhiteSpace(Request["rows"]) ? 1 : Int32.Parse(Request["rows"]);
                    string order = string.IsNullOrWhiteSpace(Request["order"]) ? "ASC" : Request["order"].ToUpper();
                    string sort = string.IsNullOrWhiteSpace(Request["sort"]) ? "ID" : Request["sort"];
                    IQueryable<t_dt_energyitemdict> query = CommonTools.DataSorting<t_dt_energyitemdict>(list.AsQueryable(), sort, order).Skip((page - 1) * rows).Take(rows);
                    Response.Write(JsonHelper.Serialize(new { total = list.Count, rows = query }));
                    Response.End();
                }
                if (Request.QueryString["type"] == "add")
                {
                    string strMsg;
                    if (AddObject(out strMsg))
                    {
                        Response.Write(JsonHelper.Serialize(new { result = true, msg = strMsg }));
                    }
                    else
                    {
                        Response.Write(JsonHelper.Serialize(new { result = false, msg = strMsg }));
                    }
                    Response.End();
                }
                if (Request.QueryString["type"] == "modify")
                {
                    string strMsg;
                    if (ModifyObject(out strMsg))
                    {
                        Response.Write(JsonHelper.Serialize(new { result = true, msg = strMsg }));
                    }
                    else
                    {
                        Response.Write(JsonHelper.Serialize(new { result = false, msg = strMsg }));
                    }
                    Response.End();
                }
                if (Request.QueryString["type"] == "del")
                {
                    string strMsg;
                    if (DelObject(out strMsg))
                    {
                        Response.Write(JsonHelper.Serialize(new { result = true, msg = strMsg }));
                    }
                    else
                    {
                        Response.Write(JsonHelper.Serialize(new { result = false, msg = strMsg }));
                    }
                    Response.End();
                }
            }
        }
        /// <summary>
        /// 增加一個對一個對象.
        /// </summary>
        /// <returns></returns>
        private bool AddObject(out string strMsg)
        {
            string F_EnergyItemCode = Request.Form["F_EnergyItemCode"];
            string F_EnergyItemName = Request.Form["F_EnergyItemName"];
            string F_ParentItemCode = Request.Form["F_ParentItemCode"];
            string F_EnergyItemType = Request.Form["F_EnergyItemType"];
            string F_EnergyItemUnit = Request.Form["F_EnergyItemUnit"];
            string F_EnergyItemFml = Request.Form["F_EnergyItemFml"];
            string F_EnergyItemState = Request.Form["F_EnergyItemState"];
            short sF_EnergyItemState = 0;
            if (short.TryParse(F_EnergyItemState, out sF_EnergyItemState))
            {
                sF_EnergyItemState = short.Parse(F_EnergyItemState);
            }
            bool bPass = false;
            try
            {
                using (item_energyEntities ent = new item_energyEntities())
                {
                    t_dt_energyitemdict aNewModel = new t_dt_energyitemdict()
                    {
                        F_EnergyItemCode = F_EnergyItemCode,
                        F_EnergyItemState = sF_EnergyItemState,
                        F_EnergyItemType = F_EnergyItemType,
                        F_EnergyItemUnit = F_EnergyItemUnit,
                        F_EnergyItemName = F_EnergyItemName,
                        F_EnergyItemFml = F_EnergyItemFml,
                        F_ParentItemCode = F_ParentItemCode
                    };
                    ent.t_dt_energyitemdict.Add(aNewModel);
                    if (ent.SaveChanges() > 0)
                    {
                        bPass = true;
                        strMsg = "增加成功。";
                    }
                    else
                    {
                        bPass = false;
                        strMsg = "增加失敗,請稍後再試。";
                    }
                }
            }
            catch (Exception ex)
            {
                strMsg = ex.Message;
                bPass = false;
            }
            return bPass;
        }
        /// <summary>
        /// 更新一個對象.
        /// </summary>
        /// <returns></returns>
        private bool ModifyObject(out string strMsg)
        {
            string F_EnergyItemCode = Request.Form["F_EnergyItemCode"];
            string F_EnergyItemName = Request.Form["F_EnergyItemName"];
            string F_ParentItemCode = Request.Form["F_ParentItemCode"];
            string F_EnergyItemType = Request.Form["F_EnergyItemType"];
            string F_EnergyItemUnit = Request.Form["F_EnergyItemUnit"];
            string F_EnergyItemFml = Request.Form["F_EnergyItemFml"];
            string F_EnergyItemState = Request.Form["F_EnergyItemState"];
            short sF_EnergyItemState = 0;
            if (short.TryParse(F_EnergyItemState, out sF_EnergyItemState))
            {
                sF_EnergyItemState = short.Parse(F_EnergyItemState);
            }
            bool bPass = false;
            try
            {
                using (item_energyEntities ent = new item_energyEntities())
                {
                    t_dt_energyitemdict aModel = (from c in ent.t_dt_energyitemdict where c.F_EnergyItemCode == F_EnergyItemCode select c).FirstOrDefault();
                    if (aModel != null)
                    {
                        aModel.F_EnergyItemCode = F_EnergyItemCode;
                        aModel.F_EnergyItemName = F_EnergyItemName;
                        aModel.F_ParentItemCode = F_ParentItemCode;
                        aModel.F_EnergyItemType = F_EnergyItemType;
                        aModel.F_EnergyItemUnit = F_EnergyItemUnit;
                        aModel.F_EnergyItemFml = F_EnergyItemFml;
                        aModel.F_EnergyItemState = sF_EnergyItemState;
                        if (ent.SaveChanges() > 0)
                        {
                            bPass = true;
                            strMsg = "修改成功。";
                        }
                        else
                        {
                            bPass = false;
                            strMsg = "修改失敗,請稍後再試。";
                        }
                    }
                    else
                    {
                        bPass = false;
                        strMsg = "不存在此記錄,請稍後再試。";
                    }
                }
            }
            catch (Exception ex)
            {
                strMsg = ex.Message;
                bPass = false;
                //throw;
            }
            return bPass;
        }
        /// <summary>
        /// 刪除一個對象.
        /// </summary>
        /// <returns></returns>
        private bool DelObject(out string strMsg)
        {
            string F_EnergyItemCode = Request.QueryString  ["F_EnergyItemCode"];
            bool bPass = false;
            using (item_energyEntities ent = new item_energyEntities())
            {
                t_dt_energyitemdict aModel = (from c in ent.t_dt_energyitemdict where c.F_EnergyItemCode == F_EnergyItemCode select c).FirstOrDefault();
                try
                {
                    if(aModel!=null)
                    {
                        ent.t_dt_energyitemdict.Remove(aModel);
                        if(ent.SaveChanges()>0)
                        {
                            bPass = true;
                            strMsg = "刪除成功。";
                        }
                        else
                        {
                            bPass = false;
                            strMsg = "刪除失敗,請稍後再試。";
                        }
                    }
                    else
                    {
                        bPass = false;
                        strMsg = "不存在此記錄,請稍後再試。";
                    }
                }
                catch (Exception ex)
                {
                    bPass = false;
                    strMsg = ex.Message;
                }
            }
            return bPass;
        }  
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章