如何使用 asp.net mvc 3 填充 jqgrid

本文关键字:填充 jqgrid mvc net 何使用 asp | 更新日期: 2023-09-27 18:33:52

我正在尝试使用来自我的[HttPost]控制器方法的数据填充jqgrid。

我的控制器看起来像这样

Public ActionResult Index()
{
   SearchModel sm = new SearchModel();
   // gets specific data from sm here
   return View(sm);
}
[HttpPost]
Public ActionResult Index(SearchModel sm)
{
   // does some stuff with the entered data from the form to return search results
   // not sure what exactly to do here....
}

我的表单如下所示:

@model SearchModel
@{
   //layout stuff and other script links are here
}
{Html.EnableClientValidation();}
@using (Html.BeginForm("Index", "Page",
                 FormMethod.Post, new { id = "search-form" }))
{
   //I have the form and post data here
}
@if (Model.SearchRecords != null)
{
    Html.RenderPartial("SearchRecordsPartial");
}

jqgrid 所在的部分如下所示:

@model SearchModel
<div>
    <table id="list" class="scroll" cellpadding="0" cellspacing="0"></table>
    <div id="pager" class="scroll" style="text-align:center;"></div>
</div>

jquery:

$(function () {
    $("#list").jqGrid({
        url: '/Page/Index/',
        datatype: 'json',
        mtype: 'GET',
        colNames: ['Id', 'Votes', 'Title'],
        colModel: [
                  { name: 'Id', index: 'Id', width: 40, align: 'left' },
                  { name: 'Votes', index: 'Votes', width: 40, align: 'left' },
                  { name: 'Title', index: 'Title', width: 400, align: 'left'}],
        pager: jQuery('#pager'),
        rowNum: 10,
        rowList: [5, 10, 20, 50],
        sortname: 'Id',
        sortorder: "desc",
        viewrecords: true,
        imgpath: '/content/themes/ui-lightness/images',
        caption: 'Appeal Case Records'
    });
});

任何帮助或如何执行此操作的链接都会很棒。我尝试在线搜索帮助,有很多不同的文章,但我似乎找不到使用 asp.net mvc 从表单数据填充 jqgrid 的文章。

谢谢

如何使用 asp.net mvc 3 填充 jqgrid

这里有一个很好的链接:

将 jQuery Grid 与 ASP.NET MVC 结合使用

我正在组装一个MVC4 jqGrid,这对我帮助很大。

编辑:只是为了添加更多的颜色,我认为您不想在 Index 操作中返回网格结果。 jQgrid 将在需要加载新数据时调用您指定的 url - 作为排序、搜索、刷新等的结果......如果你看看我链接的文章,它会更详细地介绍这一点。

如果您只想在网格中显示数据,则可以使用以下代码,但是如果要使用添加,编辑,删除,过滤,排序等功能,则此代码还不够,请详细指定要求。

[HttpPost]
Public ActionResult Index(SearchModel sm)
{
        List<Object> returnData = new List<Object>();
        returnData.Add(new { id = 1, cell = new string[] {"Id1","Votes1","Title1"} });
        returnData.Add(new { id = 2, cell = new string[] {"Id2","Votes2","Title2"} });
        returnData.Add(new { id = 3, cell = new string[] {"Id3","Votes3","Title3"} });
        var result = new { total = 1, page = 1, records = 3, rows = returnData };
        return Json(result, JsonRequestBehavior.AllowGet);
}    

您应该在该控制器操作中传递排序和分页参数

[HttpPost]
public ActionResult ListCustomer(string sidx, string sord, int page, int rows)
{
  // return the json data
}