我對這個從code for pivot提取Jqgrid
支點版本以下設置,但跑了,當它給了javascript
錯誤爲什麼jqGrid不會加載?
SCRIPT5007:無法獲取未定義或爲空 參考jquery.jqGrid的特性「長度」。 min.js,line 504 character 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>
您嘗試從'53721'端口加載數據,如果不是從HTML頁面加載相同的端口將無法正常工作。見[相同的來源政策](https://en.wikipedia.org/wiki/Same-origin_policy)。此外,你不應該在'jquery.jqGrid.min.js'中發佈錯誤。您應該使用'jquery.jqGrid.src.js'版本重新進行測試,併發布相應的錯誤消息。你應該在'jquery.jqGrid.min.js'(或'jquery.jqGrid.src.js')之前包含'grid.locale-en.js'。 – Oleg