easyUI对列表的增、删、改、查例子。

最新推荐文章于 2021-06-03 23:06:52 发布

zzr494684778

最新推荐文章于 2021-06-03 23:06:52 发布

阅读量2.7k

点赞数 1

分类专栏： EastUI asp.net

本文链接：https://blog.csdn.net/zzr494684778/article/details/49929967

版权

asp.net 同时被 2 个专栏收录

21 篇文章 0 订阅

订阅专栏

EastUI

1 篇文章 0 订阅

订阅专栏

列表前端：

<body class="easyui-layout">
    <div data-options="region:'north',border:false,iconCls:'icon-search',hideCollapsedContent:false" title="查询" style="padding:10px; height:80px;">
        <div>
            <form id="form1">
                <label for="txtSerachName">姓名：</label>
                @*<input type="text" id="build_path" name="[Equal]build_path" />*@  
                @Html.TextBox("UserName").ForSearch(QueryMethod.Contains)
                <a href="#" class="easyui-linkbutton" iconcls="icon-search" id="btnSerach" name="btnSerach">搜索</a>
            </form>
        </div>
    </div>
    <div id="List" data-options="region:'center'"></div>
    <div id="edit-window" title="编辑/添加" style="width: 600px; height: 400px; padding: 5px;">
    </div>
</body>

<script type="text/javascript">
    var grid;
    $(function () {
        initTable();
    });

    //初始化列表
    function initTable(queryData) {
        grid = $('#List').datagrid({
            title: "管理列表",
            url: '/admin/SYManager/list',
            width: 'auto',
            methord: 'post',
            height: 'auto',
            fitColumns: true,
            //sortName: 'id',
            //sortOrder: 'desc',
            idField: 'Id',
            pageSize: 15,
            pageList: [15, 20, 30, 40, 50],
            pagination: true,
            striped: true, //奇偶行是否区分
            singleSelect: true,//单选模式
            loadMsg: "Loading...",
            rownumbers: true,
            columns: [[
                { field: 'UserName', title: '账号', width: 100 },
                { field: 'RealName', title: '真实姓名', width: 200 },
                { field: 'Telephone', title: '手机号', width: 120 },
                {
                    field: 'UpdateTime', title: '操作时间', width: 140,
                    formatter: function (value) {
                        return FormatTime(value, "yyyy-MM-dd hh:mm:ss");
                    }
                },
                { field: 'EmailForm', title: '发件人邮箱地址', width: 200 },
                {
                    field: 'Status', title: '状态', width: 80,
                    formatter: function (value) {
                        if (value == 1) return "启用";
                        else if (value == 0) return "未启用";
                        else if (value == -1) return "删除";
                    }
                }
            ]],
            toolbar: [{
                id: 'btnadd',
                text: '添加用户',
                iconCls: 'icon-add',
                handler: function () {
                    //实现弹出添加用户信息的层
                    Add(0);
                }
            }, '-', {
                id: 'btncut',
                text: '修改用户',
                iconCls: 'icon-cut',
                handler: function () {
                    //实现弹出修改用户信息的层
                    Edit(0);
                }
            }, '-', {
                id: 'btnsave',
                text: '删除用户',
                iconCls: 'icon-remove',
                handler: function () {
                    //确认只删除一条用户信息
                    DeleteUserInfoByClick();
                }
            }]

        });
    }

    //添加信息
    function Add(parentID) {
        dialogWin = openDialog("#edit-window", "添加用户", "Add", "icon-add").dialog('open');
        return false;
    }

    //编辑信息
    function Edit(id) {
        var idArray = getSelectedArr(id);
        if (idArray.length == 0) {
            Msgfade("请选择一条记录进行操作!");
            return;
        }
        else if (idArray.length > 1) {
            Msgfade('只能选择一条记录进行修改!');
            return;
        }
        else {
            dialogWin = openDialog("#edit-window", "修改信息", "Edit?Id=" + idArray.join(','), "icon-edit").dialog('open');
        }
        return false;
    }

    function getSelectedArr(id) {
        var ids = [];
        var rows = grid.datagrid('getSelections');
        if (id == 0) {
            for (var i = 0; i < rows.length; i++) {
                ids.push(rows[i].Id);
            }
        }
        else {
            ids.push(id);
        }
        return ids;
    }

    //关闭编辑窗口并刷新列表
    function close() {
        dialogWin.dialog('close');
        refreshGrid();
    }
    //关闭编辑窗口
    function cancel() {
        dialogWin.dialog('close');
    }
    //刷新列表
    function refreshGrid() {
        grid.datagrid('reload');
        grid.datagrid('clearSelections');
    }
</script>

@*operation*@
<script type="text/javascript">
    $("#btnSerach").click(function () {
        grid.datagrid('options').queryParams = $("#form1").serializeJson();
        grid.datagrid("load");
        return false;
    });
</script>

添加前端：

@model TMS.Model.sy_Manager
@section Scripts{
    @Html.Partial("~/Areas/Admin/Views/Shared/_Layout_Base_Edit.cshtml");
}
<body class="easyui-layout">
    <div data-options="region:'center',border:true">
        @using (Html.BeginForm("Save", ViewContext.RouteData.Values["controller"].ToString(), FormMethod.Post, new { ID = "EditForm", name = "EditForm", style = "width:100%;height:100%;" }))
        {
            @Html.AntiForgeryToken()
            @Html.HiddenFor(m => m.Id)
            @Html.Hidden("SelectdRole")
            <div class="easyui-tabs" data-options="border:false,plain:true">
                <div title="基本属性" class="tab-content">
                    <dl>
                        <dt>用户名</dt>
                        <dd>
                            @Html.TextBoxFor(m => m.UserName, new { @class = "easyui-textbox", @required = "true" })
                        </dd>
                    </dl>
                    <dl>
                        <dt>密码</dt>
                        <dd>@Html.PasswordFor(m => m.Password, new { @class = "easyui-textbox", @required = "true", @value = Model.Password })</dd>
                    </dl>
                    <dl>
                        <dt>真实姓名</dt>
                        <dd>@Html.TextBoxFor(m => m.RealName, new { @class = "easyui-textbox" })</dd>
                    </dl>
                    <dl>
                        <dt>手机</dt>
                        <dd>@Html.TextBoxFor(m => m.Telephone, new { @class = "easyui-textbox" })</dd>
                    </dl>
                    <dl>
                        <dt> 发件人邮箱地址:</dt>
                        <dd>
                            @Html.TextBoxFor(m => m.EmailForm, new { @class = "easyui-textbox", @validtype = "email", @required = "true", @missingMessage = "不能为空", @invalidMessage = "邮箱格式不正确" })
                            <span class="alertright" id="email"></span>
                        </dd>
                    </dl><dl>
                        <dt>状态</dt>
                        <dd>
                            @Html.DropDownListFor(m => m.Status, new List<SelectListItem>{
                           (new SelectListItem(){Text="启用",Value="1"}),
                           (new SelectListItem(){Text="未使用",Value="0"}),
                           (new SelectListItem(){Text="删除",Value="-1"})}, new { @class = "easyui-combobox", data_options = "editable:false,panelHeight:'auto'", style = "width:150px;" })
                        </dd>
                    </dl>
                </div>
              
            </div>
        }
    </div>
    <div data-options="region:'south',border:false" style="text-align:center">
        <a href="javascript:void(0)" class="easyui-linkbutton c6" οnclick="return Save();" style="width:90px">Save</a>
        <a href="javascript:void(0)" class="easyui-linkbutton" οnclick="return window.parent.close();" style="width:90px">Cancel</a>
    </div>
    <script type="text/javascript">
        function Save() {
            var nodes = $('#roleSet').tree('getChecked');
            var s = '';
            for (var i = 0; i < nodes.length; i++) {
                if (s != '') s += ',';
                s += nodes[i].id;
            }
            $("#SelectdRole").val(s);
            btnSave();
        }
    </script>
</body>

后台：需要引用命名空间

using Microsoft.Practices.Unity;
using System.Web.Mvc;
using System.Collections.Generic;
using System.EnterpriseServices;

列表：

public ActionResult List(QueryModel query)
        {
            if (Request.IsAjaxRequest())
            {
                query.PageIndex = Request["page"].DefaultIsNullOrEmpty(1);
                query.PageSize = Request["rows"].DefaultIsNullOrEmpty(2);
                query.Items.Add(new ConditionItem("Status", QueryMethod.NotEqual, -1));             
                var pagelist = service.FindAllByPage(query, p => p.UpdateTime);
                var easyUIPages = new Dictionary<string, object>();
                easyUIPages.Add("total", pagelist.TotalItemCount);
                easyUIPages.Add("rows", pagelist);

                return Json(easyUIPages, JsonRequestBehavior.AllowGet);
            }
            else
                return View();
        }

增加：

 public ActionResult Add()
        {
            ViewData.Model = new sy_Manager();
            return View(viewPath + "Edit.cshtml");
        }

修改：

   [Description("修改")]
        public ActionResult Edit(int id)
        {
            ViewData.Model = service.Find(id);
            return View(viewPath + "Edit.cshtml");
        }

保存：

 [HttpPost]
        [ValidateAntiForgeryToken]
        public ActionResult Save(sy_Manager formModel)
        {
            var result = false;
            var message = string.Empty;
            try
            {
                if (ModelState.IsValid)
                {
                    var selectedRole = Request["SelectdRole"].DefaultIsNullOrEmpty(string.Empty);
                    
                    if (formModel.Id != 0)
                    {
                        var model = service.Find(formModel.Id);
                        UpdateModel<sy_Manager>(model);
                        model.Password = Encrypt.MD5(model.Password);
                        model.UpdateTime = model.CreateTime = DateTime.Now;
                        service.Update(model);
                        message = "更新成功";
                    }
                    else
                    {
                        formModel.Password = Encrypt.MD5(formModel.Password);
                        formModel.UpdateUser = formModel.CreateUser = "admin";
                        formModel.UpdateTime = formModel.CreateTime = DateTime.Now;
                        service.Add(formModel);
                        message = "新增成功";
                    }                   
                    result = true;
                }
            }
            catch (Exception e)
            {
                result = false;
                message = "系统发生错误，请联系管理员";
                ModelState.AddModelError("", e.Message);
            }
            message += ModelStateExtensions.ExpendErrors(this);
            return Json(new { success = result, message = message }, JsonRequestBehavior.AllowGet);
        }

删除：

 public ActionResult Delete(string data)
        {
            string[] Ids = string.IsNullOrEmpty(data) ? new string[] { } : data.Split(',');
            int Id = -1;
            var result = false;
            var message = string.Empty;
            try
            {
                foreach (string str in Ids)
                {
                    if (int.TryParse(str, out Id)) //如果Id可以转换成int型
                    {
                        var model = service.Find(Id);
                        if (model != null)//如果model存在
                        {
                            UpdateModel<SmtpInfo>(model);
                            model.UpdateTime = DateTime.Now;
                            model.UpdateUser = "Admin";
                            model.Status = -1;
                            service.Update(model);
                            message = "删除成功";
                        }
                    }
                }
            }
            catch (Exception e)
            {                
                result = false;
                message = "系统发生错误，请联系管理员";
                ModelState.AddModelError("", e.Message);
            }
            message += ModelStateExtensions.ExpendErrors(this);
            return Json(new { success = result, message = message }, JsonRequestBehavior.AllowGet);
        }