Question

我对从code for pivot中提取的Jqgrid数据透视版本进行了以下设置，但在运行时却出现了javascript错误

SCRIPT5007：无法获得属性＆＃39;长度＆＃39;未定义或null 引用jquery.jqGrid.min.js，第504行字符98

我该如何解决这个问题？

数据来自json

C#

这是我的MVC行动

   [AllowAnonymous]
    [HttpGet]
    public JsonResult GetProducts() {

        var coll = new List<SampleProductModel>();

        //"CategoryName":"Beverages","ProductName":"Steeleye Stout","Country":"UK","Price":"1008.0000","Quantity":"65"
        var p1 = new SampleProductModel { CategoryName = "Beverages", ProductName = "Steeleye Stout", Country = "UK", Price = "1008.0000", Quantity = "65" };
        coll.Add(p1);


        //"CategoryName":"Beverages","ProductName":"Steeleye Stout","Country":"UK","Price":"1008.0000","Quantity":"65"
        var p2 = new SampleProductModel { CategoryName = "Beverages", ProductName = "Big John", Country = "UK", Price = "1008.0000", Quantity = "65" };
        coll.Add(p2);

        //{"CategoryName":"Beverages","ProductName":"Laughing Lumberjack Lager","Country":"USA","Price":"140.0000","Quantity":"10"},
        var p3 = new SampleProductModel { CategoryName = "Beverages", ProductName = "Laughing Lumberjack Lager", Country = "USA", Price = "140.0000", Quantity = "10" };
        coll.Add(p3);


        //{"CategoryName":"Beverages","ProductName":"Laughing Lumberjack Lager","Country":"USA","Price":"140.0000","Quantity":"10"},
        var p4 = new SampleProductModel { CategoryName = "Beverages", ProductName = "Jims", Country = "USA", Price = "140.0000", Quantity = "10" };
        coll.Add(p4);

        return Json(coll, JsonRequestBehavior.AllowGet);
    }

这是我从上面的链接中提取并修改为采用C＃json数据的代码

<!DOCTYPE html>
<html>
<head lang="en">

    <link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/start/jquery-ui.css" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqgrid/4.6.0/css/ui.jqgrid.css" />
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js" integrity="sha256-VazP97ZCwtekAsvgPBSUwPFKdrwD3unUfSGVYrahUqU=" crossorigin="anonymous"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jqgrid/4.6.0/js/jquery.jqGrid.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jqgrid/4.6.0/js/i18n/grid.locale-en.js"></script>
    <script>

            jQuery(document).ready(function() {
                jQuery("#grid").jqGrid('jqPivot',
                        "http://localhost:53721/Home/GetProducts",
                        // pivot options
                        {
                            xDimension : [
                                {dataName: 'CategoryName', label : 'Category', width: 90},
                                {dataName: 'ProductName', label : 'Product', width:90}
                            ],
                            yDimension : [
                                {dataName: 'Country'}
                            ],
                            aggregates : [
                                {member : 'Price', aggregator : 'sum', width:50, label:'Sum'},
                                {member : 'Quantity', aggregator : 'sum', width:50, label:'Qty'}
                            ],
                            rowTotals: true,
                            colTotals : true

                        },
                        // grid options
                        {
                            width: 700,
                            rowNum : 10,
                            pager: "#pager",
                            caption: "Amounts and quantity by category and product"
                        });
            })
    </script>
</head>
<body>

<table id="grid"></table>
<div id="pager"></div>

</body>
</html>

Answer 1

对jqgrid不太了解，但我怀疑你的jquery和jqgrid版本可能不兼容。所以我查了一下，你的jqgrid版本似乎是版本4.6.0，其中最新的版本似乎是5.0.2：

http://www.trirand.com/jqgridwiki/doku.php

所以也许尝试更新它？

http://www.trirand.com/blog/?page_id=6

为什么jqGrid不会加载？

1 个答案: