控制器返回值但未显示在 ASP.NET Core 的 JqGrid 中

Posted 2023-05-07

【中文标题】控制器返回值但未显示在 ASP.NET Core 的 JqGrid 中

【英文标题】：Controller return values but not show in JqGrid in ASP.NET Core

【发布时间】：2021-05-19 01:18:47

【问题描述】：

我正在使用 jqgrid，控制器返回值列表，但值未显示在 jqgrid 上。行创建按钮 groupid，名称未显示。我也正确使用断点控制器返回数据表，但未在 jqgrid 上显示。 我还附上了screenshort你可以看到实际的结果。

控制器

public JsonResult mfollowsummary(int id)

    using (objSqlCon = new SqlConnection(conn))
    
        SqlCommand cmd = new SqlCommand("select Group_Id,Group_Name from Groups where Comp_Id=" + 1 + "", objSqlCon);
        cmd.CommandType = CommandType.Text;

        SqlDataAdapter sd = new SqlDataAdapter(cmd);
        DataTable dt = new DataTable();
               
        objSqlCon.Open();
        sd.Fill(dt);
        objSqlCon.Close();
        string JSONString = JsonConvert.SerializeObject(dt);
        var people = JsonConvert.DeserializeObject<List<Groups>>(JSONString);

        return Json(people);
    

短片 Return Result of function

Jqgrid 链接

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/themes/redmond/jquery-ui.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.15.5/css/ui.jqgrid.min.css">

<script src="https://cdnjs.cloudflare.com/ajax/libs/free-jqgrid/4.15.5/jquery.jqgrid.min.js"></script>

Javascript

<script type="text/javascript">

    jQuery(document).ready(function ($) 
        var $grid = $("#jqGrid");

        $grid.jqGrid(
            url: '@Url.Action("mfollowsummary")',
            datatype: 'json',
            postData: 
            ,
            jsonReader:  id: 'Group_Id' ,
            colModel: [
                 name: 'GroupId', width: 20, hidden: false, editable: true, editable: "disabled" ,
                 name: 'GroupName', width: 200, frozen: true, editable: true, searchoptions:  sopt: ['cn']  ,

            ],
            loadonce: true,
            navOptions: 
                reloadGridOptions:  fromServer: true 
            ,
            formEditing: 

                closeOnEscape: true,
                closeAfterEdit: true,
                savekey: [true, 13],
                reloadGridOptions: 

                    fromServer: true
                
            ,
            forceClientSorting: true,
            viewrecords: true,

            autowidth: true,
            shrinkToFit:true,
            height: 350,
            rowNum: 100,
            rowList: [10, 20, 30, 50, 100, 500],
            pager: "#jqGridPager",
         
            rownumbers: true,
            sortname: 'Group_Name',
            sortorder: 'Group_Name',
     

            loadComplete: function () 
                //$("tr.jqgrow:odd").css("background", "#f0f8ff");

            ,
        );


        $("#jqGrid").jqGrid("setFrozenColumns");
    );


</script>

结果截图 Return Function Result

HTML

 <div class="table-responsive">
       <table id="jqGrid" class="table"></table>
 </div>
 <div id="jqGridPager"></div>

【参考方案1】：

您只设置了 id，但没有设置名称。您的 colModel 名称不尊重返回的数据。尝试使用以下 colModel。

        colModel: [
             name: 'Group_Id', width: 20, hidden: false, editable: true, editable: "disabled" ,
             name: 'Group_Name', width: 200, frozen: true, editable: true, searchoptions:  sopt: ['cn']  ,

        ],

注意名称Group_Id、Group_Name，对应于您从服务器返回的内容。

JSON 响应 JSON Response screenshort

【讨论】：

我用了这行代码，但问题还是一样。

能否请您从服务器发布您的回复？为此目的使用调试控制台。

这是我调试时的结果，我还在控制器部分下方发布了结果图像 001 会员帐户 002 供应商 003 企业社会责任 004 员工 005 代理人

我的意思是在浏览器控制台中看到的结果。网格在哪里按 Ctrl+Shit + J 并查看来自服务器的 JSON 响应。那是重要的部分。见here

你好@TonyTomov 我已经在浏览器控制台中附上了json响应的截图。