如何在 MVC 中将数据从 JsonResult 传递到 JQGrid?

How to pass data from JsonResult to JQGrid in MVC?

我已经使用 JQGrid 从使用“GET”的控制器获取数据。但是,我还是一片空白 table。我还尝试应用断点并检查“详细信息”方法中的变量“详细信息”是否获取值。它运作良好。我想问题在于以 JSON 格式返回数据。

控制器

 [HttpGet]
        public JsonResult Detail()
        {

            IntegrationsProcessor db = new IntegrationsProcessor(new MCNIDbContext());
            DBModel.Integrations row = db.GetIntegrationRow();
            List<Integrations> details = new List<Integrations>
            {
                new Integrations
                {
                    IntegrationName = row.IntegrationName,
                    CompanyEmail = row.CompanyEmail
                }
            };


            return new JsonResult()
            {
                Data = details,
                JsonRequestBehavior = JsonRequestBehavior.AllowGet,
                MaxJsonLength = Int32.MaxValue
            };

HTML 文件

@using MCNIDev.CustomControls
@model MCNIDev.Models.ViewModel.Integrations


@{
    ViewBag.Title = "Details";
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=devicexb c-width" />
    <title>Integrations</title>
</head>
@Styles.Render("~/Content/toasterCss")
@Styles.Render("~/Content/dataPickerCss")
<style type="text/css">
    .btn {
        min-width: 80px !important;
    }
</style>
<body>
    @using (Html.BeginForm("", "Integrations", FormMethod.Post, new { enctype = "multipart/form-data", @class = "form-horizontal", id = "frmManifestOrders" }))
    {
        <div class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1 class="m-0 text-dark">Integrations</h1>
                    </div><!-- /.col -->
                </div><!-- /.row -->
            </div><!-- /.container-fluid -->
        </div><!-- /.content-header -->

        <section class="content">
            <div class="container-fluid">
                <div class="card card-block">
                    <div class="row table-responsive">
                        <div class="col-md-12">
                            <div class="row">
                                <div class="col-md-12 col-sm-12">
                                    <table id="tblSelectIntegrations"></table>
                                    <div id="divSelect"></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <div class="row">
                                <div class="col-md-12">
                                    <hr />
                                    <input type="button" class="btn btn-secondary" onclick="document.location.href='/Dashboard/Dashboard';" value="Cancel" />
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    }
</body>
</html>

@Scripts.Render("~/bundles/integrations")
<script>
$(document).ready(function(){
    Integrate.GetValue();
});
</script>

JQGrid 文件

var Integrate = function() {
function GetValue() {
    $("#tblSelectIntegrations").jqGrid({
        type: "GET",
        url: "/Integrations/Detail",
        datatype: "json",
        async: false,
        colNames: [
            "First Name", "Email Address"
        ],
        colModel: [
            //{
            //    name: '',
            //    key: false,
            //    width: 30,
            //    editable: true,
            //    formatter: function () {
            //        return "<input type='checkbox' value='Select' class='fm-button ui-state-default ui-corner-all fm-button-icon-left noPrint'\>";
            //    }
            //},
            { key: false, name: 'IntegrationName', index: 'IntegrationName', editable: false, width: 200 },
            { key: false, name: 'CompanyEmail', index: 'CompanyEmail', editable: false, width: 200 },
         //   { key: false, name: 'Blank', index: 'Blank', editable: false, width: 200 }
        ],
        pager: jQuery("#divSelect"),
        rowNum: 1,
        scroll: 0,
        height: $(window).innerHeight() - 450,
        width: "100%",
        viewrecords: true,
        caption: "Product",
        emptyrecords: "No records to display",
        jsonReader: {
            root: "rows",
            page: "page",
            total: "total",
            records: "records",
            repeatitems: false
        },
        autowidth: true,
        multiselect: false,
        loadonce: false,
        ajaxGridOptions: { cache: false },
        gridComplete: function () {
        },
       
    }).navGrid("tblSelectIntegrations", { edit: false, add: false, del: false, search: false, refresh: false });
}
return {
        GetValue: GetValue
    };
}();

问题出在控制器。我试图在不告诉 JQGrid 在哪里插入数据的情况下发送数据。

var jsonData = new
            {
                rows = value
            };
            return Json(jsonData, JsonRequestBehavior.AllowGet);

用上面的代码替换下面的代码

return new JsonResult()
            {
                Data = details,
                JsonRequestBehavior = JsonRequestBehavior.AllowGet,
                MaxJsonLength = Int32.MaxValue
            };

在我的第一个代码中,我提到了在行中添加我的数据。