在asp.net mvc中使用jequery中的jqgrid的问题

时间:2010-11-29 09:09:44

标签: jquery asp.net-mvc-2 jqgrid

我正在开发ASP.NET MVC 2应用程序。我想展示对象数据列表的网格。比如List<MyObject>。所以我在控制器操作中尝试了一个代码:

[HttpGet]
public ActionResult JsonSalesCollection()
{
    string id = Request.QueryString["id"];

    ViewData["TrustId"] = id;
    Guid id1 = new Guid(id);

    List<TrustContract> contractList = trustContractmang.GetListOfTrustContractByTrustId(id1);
    int pageIndex = 12;
    int pageSize = 20;
    int totalRecords = contractList.Count();
    int totalPages = (int)Math.Ceiling((float)totalRecords / (float)pageSize);
    string orderBy = string.Format("{0} {1}", "TrustContracId", "desc");

    var jsonData = new
    {
        total = totalPages,
        page = 20,
        records = totalRecords,
        rows = (
            from s in contractList
            select new
            {
                i = s.TrustContracId,
                cell = new string[] {
                    s.TrustContracId.ToString(),
                    s.Trust.TrustName.ToString(),
                    s.ContractStartDate.ToShortDateString(),
                    s.ContractEndDate.ToShortDateString(),
                    s.ContractAmount.ToString(), 
                    s.RecoveredAmount.ToString(),
                    s.IsCompleted.ToString()
                }
            }).ToArray()
    };

    return Json(jsonData);
}

运行正常,也生成JSON结果。在视图页面上我使用脚本:

var gridimgpath = '/Scripts/jqgrid/themes/redmond/images';

var TrustId = <%= serializer.Serialize(ViewData["TrustId"]) %>;

// use date.js to calculate the values for this month
var gridDataUrl = '/NewTrustContract/JsonSalesCollection?id='+ TrustId;

$("#list").jqGrid({
    url: gridDataUrl,
    datatype: "json",
    mtype: 'GET',

    colNames: ['TrustContracId', 'Trust', 'Contract Start Date',
               'Contract End Date', 'Contract Amount', 'Recovered Amount',
               'Is Completed'],
    colModel: [
        { name: 'TrustContracId', index: 'TrustContracId', width: 50, align: 'left' },
        { name: 'Trust', index: 'Trust', width: 100, align: 'left' },
        { name: 'ContractStartDate', index: 'ContractStartDate', width: 100, align: 'left' },
        { name: 'ContractEndDate', index: 'ContractEndDate', width: 100, align: 'left' },
        { name: 'ContractAmount', index: 'ContractAmount', width: 100, align: 'left' },
        { name: 'RecoveredAmount', index: 'RecoveredAmount', width: 100, align: 'right' },
        { name: 'IsCompleted', index: 'IsCompleted', width: 100, align: 'right' }
    ],
    rowNum: 20,
    rowList: [10, 20, 30],
    imgpath: gridimgpath,
    height: 'auto',
    width: '900',
    pager: jQuery('#pager'),
    sortname: 'TrustContracId',
    viewrecords: true,
    sortorder: "desc",
    caption: "Contract"
});

好的,为此,我使用了:

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

保持网格。我甚至可以在视图上看到.aspx页面上的空网格视图。但没有出现数据。所以这意味着我必须在jquery中手动迭代JSON数据。如果是,那么我可以在j查询中获取JSON数据。以及如何迭代它。我知道onli $.each用于迭代数据。但如何获取var中的数据?或此功能的其他补救措施?

我应该从哪里获取jqgrid简要文档以供阅读?

1 个答案:

答案 0 :(得分:0)

这是怎么做的。为了取得这一成功,我必须使用JsonResult而不是ActionResult。还需要在操作定义之前添加[AcceptVerbs(HttpVerbs.Get)]属性。虽然我回来了

return Json(jsonData,JsonRequestBehavior.AllowGet);

多数民众赞成,它现在运转良好。