MVC控制器返回JSON列表

时间:2016-09-09 16:15:20

标签: javascript c# json asp.net-mvc

我试图在控制器中返回JSON列表。不知道我哪里错了。任何帮助将不胜感激。我正在尝试在网上找到一个网格。

这是我的控制器:

//[HttpPost]
        public JsonResult JqueryTest()

        {
            var estimateDetails = db.EstimateDetail
                .Include(x => x.EstimationItem)
                .Include(x => x.EstimateHeader);

            return Json(estimateDetails, JsonRequestBehavior.AllowGet);

        }

以下是我的观点:

@model IEnumerable < EstimationTools.Models.Entities.EstimateDetail >



    ViewBag.Title = "JqueryTest";
}

<h2>JqueryTest</h2>

<html lang="en">
<head>
    <!-- The jQuery library is a prerequisite for all jqSuite products -->
    <script type="text/ecmascript" src="../../../js/jquery.min.js"></script>
    <!-- We support more than 40 localizations -->
    <script type="text/ecmascript" src="../../../js/trirand/i18n/grid.locale-en.js"></script>
    <!-- This is the Javascript file of jqGrid -->
    <script type="text/ecmascript" src="../../../js/trirand/jquery.jqGrid.min.js"></script>
    <!-- This is the localization file of the grid controlling messages, labels, etc.
    <!-- A link to a jQuery UI ThemeRoller theme, more than 22 built-in and many more custom -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
    <!-- The link to the CSS that the grid needs -->
    <link rel="stylesheet" type="text/css" media="screen" href="../../../css/trirand/ui.jqgrid-bootstrap.css" />


    <script>
        $.jgrid.defaults.width = 780;
        $.jgrid.defaults.styleUI = 'Bootstrap';
    </script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
    <meta charset="utf-8" />
    <title>jqGrid Loading Data - JSON</title>
</head>
<body>
    <div style="margin-left:20px">
        <table id="jqGrid"></table>
        <div id="jqGridPager"></div>
    </div>
    <script type="text/javascript">



        $(document).ready(function () {

            $("#jqGrid").jqGrid({
                url: 'EstimationTool/plugins/jqGrid',
                datatype: "json",
                colModel: [
                   { label: 'Estimate', name: 'Estimate', width: 75 },
                   { label: 'Contingency', name: 'Contingency', width: 90 },
                   { label: 'Comment', name: 'Comment', width: 100 },
                   { label: 'Subactivity', name: 'EstimationItem.Subactivity', width: 100 },
                   { label: 'EstimationArea', name: 'EstimationItem.Area.EstimationArea', width: 100 },
                   { label: 'Description', name: 'EstimationItem.GeneralActivity.Description', width: 100 }
                   // sorttype is used only if the data is loaded locally or loadonce is set to true
                ],
                viewrecords: true, // show the current page, data rang and total records on the toolbar
                width: 780,
                height: 200,
                rowNum: 30,
                loadonce: true, // this is just for the demo
                pager: "#jqGridPager"
            });
        });

    </script>

</body>
</html>

1 个答案:

答案 0 :(得分:2)

首先......正如stephen.vakil所说,你的网址中有一个错误,因为你指的是一个所谓的&#34; jqGrid&#34;

 url: 'EstimationTool/plugins/jqGrid'

通常的语法是:'{Controller}/{Action}/'

在您的情况下,操作名称为"JqueryTest",如上所述。所以,我不知道您的控制器的名称,但我希望您已经有了这个想法。像这样:

url: 'YourController/JqueryTest'

另一方面,在你的Action中,你应该返回一个列表......所以,只需在查询末尾添加.ToList()或将它附加到你的参数:

return Json(estimateDetails.**ToList()**, JsonRequestBehavior.AllowGet);

此致