jqGrid是不是渲染mvc3 razor?

时间:2013-08-20 07:28:07

标签: asp.net-mvc-3 jqgrid

我的_Layout.cshtml就像这样

 <head>
        <meta charset="utf-8" />
        <title>@ViewBag.Title - E-Reader Statistics</title>
        <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
        <meta name="viewport" content="width=device-width" />
        @Styles.Render("~/Content/css")
        @Scripts.Render("~/bundles/modernizr")
       @* @Scripts.Render("~/bundles/jquery")*@
        <link href="~/jqGrid/css/ui.jqgrid.css" rel="stylesheet" />
        <script src="~/jqGrid/js/i18n/grid.locale-en.js"></script>
        <script src="~/jqGrid/js/jquery-1.9.0.min.js"></script>
        <script src="~/jqGrid/js/jquery.jqGrid.min.js"></script>
        <script src="~/jqGrid/js/jquery.jqGrid.src.js"></script>


    </head>
在index.chtml中

@model List<LSStatisticalReport.ViewModels.GSViewModel>

@{
    ViewBag.Title = "Index";
}

@*<h2>General Statistics</h2>*@

<script type="text/javascript">
   // var jq = $.noConflict();
    $(document).ready(function () {
        var genStatGrid = $('#list');

        genStatGrid.jqGrid({
            caption: "General Statistics",
            url: '/Statistics/GetRecords/',
            datatype: "json",
            contentType: "application/json; charset-utf-8",
            mtype: 'POST',
            colNames: ['Student', 'Teacher', 'Date'],
            colModel: [
                            { name: 'studentDesignation' },
                            { name: 'teacherDesignation' },
                            { name: 'dateLength' },
              ],
            rowNum: 5
        });
    });
</script>

但是当我运行项目时,我在控制台中收到错误:

“Uncaught TypeError:Object [object Object]没有方法'jqGrid'”

1 个答案:

答案 0 :(得分:0)

这种类型的错误说明:请在相关的init脚本之前定义jqgrid库。我之前看到过这个错误,尽管你已经在head标签中定义了相关的库。所以我通过从head标签中删除它的库并将它放在脚本之前的视图并且正常工作来解决这个问题。

我认为这是因为页面的部分加载。所以在索引视图中使用它:

@model List<LSStatisticalReport.ViewModels.GSViewModel>

@{
    ViewBag.Title = "Index";
}

@*<h2>General Statistics</h2>*@
//added
<script src="~/jqGrid/js/jquery.jqGrid.min.js"></script>
<script src="~/jqGrid/js/jquery.jqGrid.src.js"></script>
//end added
<script type="text/javascript">
   // var jq = $.noConflict();
    $(document).ready(function () {
        var genStatGrid = $('#list');

        genStatGrid.jqGrid({
            caption: "General Statistics",
            url: '/Statistics/GetRecords/',
            datatype: "json",
            contentType: "application/json; charset-utf-8",
            mtype: 'POST',
            colNames: ['Student', 'Teacher', 'Date'],
            colModel: [
                            { name: 'studentDesignation' },
                            { name: 'teacherDesignation' },
                            { name: 'dateLength' },
              ],
            rowNum: 5
        });
    });
</script>