如何用 ajax 数据填充 jqgrid，这是从 asp.net MVC 控制器获取的数据？答案

【问题标题】：How to fill jqgrid with ajax data , which is data getting from asp.net MVC controller?如何用 ajax 数据填充 jqgrid，这是从 asp.net MVC 控制器获取的数据？
【发布时间】：2018-09-29 19:11:08
【问题描述】：

我正在尝试用第一列作为静态数据填充 jqgrid 第一行，其余列作为 mvc 控制器的计数。对于调用控制器，我已经编写了一个 ajax 请求，但是在尝试了一切之后我无法填充数据。

这是我的 ajax 请求。

        function getCounts() {
            var products;
            $.ajax({
                dataType:'json',
                url: "/CapacityPlanning/getResouceCount2",
                data: JSON.stringify({ resource: resourceId, levelId: "Level-1" }),
                type: "POST",
                async: false,
                contentType: "application/json; charset=utf-8",
                success: function (response) {
                    products = response;
                },
                failure: function (response) {
                    //  alert("failure: "+response);
                },
                error: function (response) {

                    // alert("error: "+response);
                }
            });

            return products;
        }

这是我的 jqgrid，我正在尝试获取这些计数。

        $("#jqGridMonthlySummary2").jqGrid({
            //data: mydatatable1,
            datatype: "json",
            height: 'auto',
            width: 1200,
            colNames: ['Resources', 'Planned (Annual)', 'July', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec', 'Jan', 'Feb', 'Mar', 'Apr', 'May', 'June'],
            colModel: [
                { name: 'Resources', width: 400, align: 'center', editable: false, sortable: false, cellattr: getCounts() },
                
                { name: 'Planned (Annual)', width: 78, align: 'center',cellattr: getCounts() },
                 { name: 'July', width: 60, align: 'center', editable: false, cellattr: getCounts() },
                 { name: 'Aug', width: 60, align: 'center', editable: false, cellattr: getCounts() },
                 { name: 'Sep', width: 60, align: 'center', editable: false, cellattr: getCounts() },
                    { name: 'Oct', width: 60, align: 'center', editable: false, cellattr: getCounts() },
                  { name: 'Nov', width: 60, align: 'center', editable: false, cellattr: getCounts() },
                   { name: 'Dec', width: 60, align: 'center', editable: false, cellattr: getCounts() },
                 { name: 'Jan', width: 60, align: 'center', editable: false, cellattr: getCounts() },
                 { name: 'Feb', width: 60, align: 'center', editable: false, cellattr: getCounts() },
                  { name: 'Mar', width: 60, align: 'center', editable: false, cellattr: getCounts() },
                  { name: 'Apr', width: 60, align: 'center', editable: false, cellattr: getCounts() },
                  { name: 'May', width: 60, align: 'center', editable: false, cellattr: getCounts() },
                  { name: 'June', width: 60, align: 'center', editable: false, cellattr: getCounts() }],
            grouping: false,

            shrinkToFit: false,
            autowidth: false,
            forceFit: true,
            gridView: true,
            caption: "Resource Data",
            rowNum: 5
        });

这是我的控制器操作方法

        public ActionResult getResouceCount2(string resource, string levelId)
    {
        CapacityPlanningEntities cpEnt = new CapacityPlanningEntities();
        //string resource = "102398";
        //string levelId = "Level-1";
        int numberOfdays = 18;
        int count = cpEnt.getResouceCount(resource, levelId);
        int TotalCount = count * numberOfdays;
        //ViewBag.Count = count;
        //return TotalCount;
        return Json(TotalCount);
    }

【问题讨论】：

您的控制器正在返回一个整数。它应该返回一个与列模型和总数匹配的对象。

标签： jquery jqgrid mvcjqgrid

【解决方案1】：

您的控制器应该返回一个对象，请参阅Here 中的答案

  public getResouceCount2(string resource, string levelId)
    {
   CapacityPlanningEntities cpEnt = new CapacityPlanningEntities();
    //string resource = "102398";
    //string levelId = "Level-1";
    int numberOfdays = 18;
    int count = cpEnt.getResouceCount(resource, levelId);
    int TotalCount = count * numberOfdays;

        var jsonData = new
        {
            total = TotalCount ,
            page = 1,
            records = 2,
            rows = cpEnt 

        };

        return Json(jsonData);
    }

【讨论】：