.net jQgrid编辑命令未在mvc操作方法中呈现

3pmvbmvn  于 2022-12-05  发布在  .NET
关注(0)|答案(1)|浏览(106)

我正在尝试在我的MVC 4应用程序中创建一个jQGrid,但是在JQGrid中有一个编辑动作不起作用。我的代码如下。

.cshtml格式文件

<table id="jQGridDemo">
</table>
<div id="jQGridDemoPager">
</div>
<script type="text/javascript">
jQuery("#jQGridDemo").jqGrid({
    url: '/Home/FillGrid/',
    datatype: "json",
    colNames: ['Id', 'Name', 'Description', 'Created'],
    colModel: [{ name: 'Id', Index: 'Id', width: 100, align: 'left' },
               { name: 'Name', Index: 'Name', width: 200, align: 'left', sortable: true, editable: true },
               { name: 'Description', Index: 'Description', width: 400, align: 'left', sortable: true, editable: true },
               { name: 'Created', Index: 'Created', width: 100, align: 'left' }],
    rowNum: 10,
    mtype: 'GET',
    loadonce: true,
    rowList: [10, 20, 30],
    pager: '#jQGridDemoPager',
    sortname: 'id',
    viewrecords: true,
    sortorder: 'desc',
    caption: "List Employee Details",
    editurl: '@Url.Action("Update", "Home")',        
    deleteurl: '@Url.Action("Delete", "Home")', 
});

$('#jQGridDemo').jqGrid('navGrid', '#jQGridDemoPager',
           {
               edit: true,
               add: true,
               del: true,
               search: true,
               searchtext: "Search",
               addtext: "Add",
               edittext: "Edit",
               deltext: "Delete"
           },
           {//EDIT
               url: '@Url.Action("Update", "Home")',
               width: 400,
           },
           {
               width: 400,
               //color: Red
           },
           {//DELETE
               url: '@Url.Action("Delete", "Home")',
           },
           {//SEARCH
               closeOnEscape: true
           }
    );

  </script>

操作

public ActionResult FillGrid(string sidx, string sord, int page, int rows)
    {
        List<Master> models = new List<Master>();

        int pageIndex = Convert.ToInt32(page) - 1;
        int pagesize = rows;
        int totalrecords = 0;
        int totalpages = 0;

        using (var db = new jQGridDemoEntities())
        {
            totalrecords = db.Masters.Count();
            totalpages = (int)Math.Ceiling((float)totalrecords / (float)pagesize);

            models = db.Masters.OrderBy(x => x.Id).Skip(pageIndex * pagesize).Take(pagesize).ToList();
        }

        var jsondata = new
        {
            total = totalpages,
            page,
            records = totalrecords,
            rows = (
            from master in models
            select new
            {
                i = master.Id,
                cell = new string[] { master.Id.ToString(), master.Name.ToString(), master.Description.ToString(), master.Created.ToString() }
            }).ToArray()
        };

        return Json(jsondata, JsonRequestBehavior.AllowGet);
    }

    [HttpPost]
    public ActionResult Update(string Name, string Description)
    {
        int ret = 2;
        return Json(ret);
    }

    [HttpPost]
    public ActionResult Delete(int Id)
    {
        int ret = 2;
        return Json(ret);
    }

我已经在jQgrid初始化部分指定了editurl和deleteurl。
例如,我需要更新“编辑”弹出窗口中的“名称”和“描述”字段。
“更新”操作在“编辑”弹出窗口中触发,但提交操作内部不起作用。
绑定字段需要任何配置。

5f0d552i

5f0d552i1#

当前代码包含一些错误。行中的第一个错误

from master in models
select new
{
    i = master.Id,
    cell = new string[] { master.Id.ToString(), ... }
}

i属性赋值给(参见i = master.Id)而不是使用id名称(id = master.Id)。通过指定jsonReader选项的id属性,可以更改输入数据中使用的id的名称默认值为id: "id"。要使用i而不是id,可以使用jsonReader: { id: "i" }选项。
还有一个指定用于行的id的好方法:使用key: true属性来定义“Id”列。顺便说一下,如果您想向用户显示行的id,并且使用key: true属性,则不需要发送master.Id两次(一次为id = master.Id,另一次为cell = new string[] { master.Id.ToString(), ... })。您可以使用类似以下的内容

return Json((
    from master in models
    select new [] {
        master.Id.ToString(),
        master.Name,
        master.Description,
        master.Created.ToString()
    }
).ToArray(), JsonRequestBehavior.AllowGet);

在这种情况下,从FillGrid返回的数据将直接是数组或项。您不需要在返回的数据中设置totalpagerecords属性,因为您使用了loadonce: true,所有属性都会被jqGrid忽略。
同样,prmNames选项可用于将用于添加/编辑和删除操作的默认id名称重命名为其他名称。
下一个问题,你用sortname: 'id'但是只有name: 'Id'的列。因此您应该将sortname: 'id'更改为sortname: 'Id'。删除操作使用int Id。因此您可以使用prmNames: { id: "Id" }选项或将int Id重命名为int id。该选项也将在添加/编辑阳离子中使用。因此,您应该根据是否使用prmNames: { id: "Id" }选项,将int Id添加到int id,再添加到Update操作。

相关问题