我的jqGrid工作正常,正確加載數據。即使排序和分頁工作正常。 但是,當filterToolBar用於搜索數據時,它不搜索任何數據...只是繼續顯示「正在加載...」。jqGrid:Uncaught TypeError:讀取xml數據時無法讀取屬性'getAccessor'undefined
下面是包含在HEAD部分腳本引用的Tagging:
<script src="~/Scripts/js/jquery-1.11.0.min.js" type="text/javascript"></script>
<script src="~/Scripts/js/src/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="~/Scripts/js/jquery.jqGrid.min.js" type="text/javascript"></script>
HTML:
<table id="jqGrid" ></table>
<div id="pager"></div>
<script type="text/javascript">
$("#jqGrid").jqGrid({
url: "GetData.asmx/LoadData",
datatype: "xml",
xmlReader: {
repeatitems: false,
root: "Rowset",
row: "Row"
},
colNames: ["Id","Contact Name", "City", "Country"],
colModel: [
{ name: 'id', index: 'id', width: 40, stype: 'text',sortable:true },
{ name: "ContactName", index: "ContactName", sortable: true, width: 300, search: true, stype: 'text' },
{ name: "City", index: "City", sortable: true, width: 300, search: true, stype: 'text' },
{ name: "Country", index: "Country", sortable: true, width: 300, search: true, stype: 'text' }
],
rowNum: 10,
rowList: [10, 20, 50, 100],
pager: "#pager",
gridview: true,
rownumbers: true,
viewrecords: true,
height: "auto",
loadonce: true,
sortorder: "desc",
caption: "List of Employees",
ignoreCase: true
}).jqGrid("filterToolbar", { searchOnEnter: false, stringResult: true, defaultSearch: "cn" });
</script>
請看看這個代碼,並引導我,在那裏得到錯誤的。
由於提前, Dipti謝斯
更新:
以下是XML響應:
<Rowsets DateCreated="2013-05-02T09:18:07" EndDate="2013-05-02T09:18:07" StartDate="2013-05-02T08:18:07" Version="12.0.6 Build(13)">
<Rowset>
<Columns>
<Column Description="Id" MaxRange="1" MinRange="0" Name="Id" SQLDataType="12" SourceColumn="Id"/>
<Column Description="ContactName" MaxRange="1" MinRange="0" Name="ContactName" SQLDataType="12" SourceColumn="ContactName"/>
<Column Description="City" MaxRange="1" MinRange="0" Name="City" SQLDataType="12" SourceColumn="City"/>
<Column Description="Country" MaxRange="1" MinRange="0" Name="Country" SQLDataType="12" SourceColumn="Country"/>
</Columns>
<Row>
<id>1</id>
<ContactName>Maria Anders</ContactName>
<City>Berlin</City>
<Country>Germany</Country>
</Row>
<Row>
<id>2</id>
<ContactName>Ana Trujillo</ContactName>
<City>México D.F.</City>
<Country>Mexico</Country>
</Row>
<Row>
<id>3</id>
<ContactName>Antonio Moreno</ContactName>
<City>México D.F.</City>
<Country>Mexico</Country>
</Row>
<Row>
<id>4</id>
<ContactName>Thomas Hardy</ContactName>
<City>London</City>
<Country>UK</Country>
</Row>
<Row>
<id>5</id>
<ContactName>Christina Berglund</ContactName>
<City>Luleå</City>
<Country>Sweden</Country>
</Row>
<Row>
<id>6</id>
<ContactName>Hanna Moos</ContactName>
<City>Mannheim</City>
<Country>Germany</Country>
</Row>
</Rowset>
</Rowsets>
響應標頭:在Chrome
的調試器的網絡標籤 個感謝, Dipti謝斯
編輯: _Layout.cshtml頁:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - My ASP.NET Application</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
<link href="~/Scripts/jquery-ui-1.11.0.custom/jquery-ui.theme.css" rel="stylesheet" media="screen" type="text/css" />
<link href="~/Content/ui.jqgrid.css" rel="stylesheet" media="screen" type="text/css" />
<style>
html, body {
margin: 0;
padding: 0;
font-size: 75%;
}
</style>
<script src="~/Scripts/js/jquery-1.11.0.min.js" type="text/javascript"></script>
<script src="~/Scripts/jquery-ui-1.11.0.custom/jquery-ui.min.js" type="text/javascript"></script>
<script src="~/Scripts/js/src/i18n/grid.locale-en.js" type="text/javascript"></script>
<script type="text/javascript">
$.jgrid.no_legacy_api = true;
$.jgrid.useJSON = true;
</script>
<script src="~/Scripts/js/jquery.jqGrid.src.js" type="text/javascript"></script>
</head>
<body>
<div class="container body-content">
@RenderBody()
</div>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)
</body>
</html>
Index.cshtml頁:
@{
ViewBag.Title = "Home Page";
}
<table id="jqGrid" ></table>
<div id="pager"></div>
<script type="text/javascript">
//<![CDATA[
/*global $ */
/*jslint browser: true */
// $(function() {
// "use strict";
$("#jqGrid").jqGrid({
url: "GetData.asmx/GetData/LoadData",
datatype: "xml",
xmlReader: {
repeatitems: false,
root: "Rowset",
row: "Row"
},
colNames: ["Id","Contact Name", "City", "Country"],
colModel: [
{ name: 'id', index: 'id', width: 40, stype: 'text',sortable:true },
{ name: "ContactName", index: "ContactName", sortable: true, width: 300, search: true, stype: 'text' },
{ name: "City", index: "City", sortable: true, width: 300, search: true, stype: 'text' },
{ name: "Country", index: "Country", sortable: true, width: 300, search: true, stype: 'text' }
],
rowNum: 10,
rowList: [10, 20, 50, 100],
pager: "#pager",
gridview: true,
rownumbers: true,
viewrecords: true,
height: "auto",
loadonce: true,
sortorder: "desc",
caption: "List of Employees",
ignoreCase: true
}).jqGrid("filterToolbar", { searchOnEnter: false, stringResult: true, defaultSearch: "cn" });
// });
//]]>
</script>
它顯示空白頁面,如果$(功能ion(){})在那裏。如果我評論這部分,那麼它會在網頁上顯示網格和數據。但仍然,工具欄搜索不起作用。
請指導我哪裏出問題了。
@DiptiSheth:我無法使用您發佈的數據重現錯誤。試試[演示](http://www.ok-soft-gmbh.com/jqGrid/DiptiSheth.htm)。 – Oleg
@Oleg:感謝演示。當它作爲獨立的HTML頁面工作時,它工作正常,但不適用於MVC模式。這很奇怪。請在問題的EDITED部分查看我的MVC代碼。 THanks –
@DiptiSheth:對不起,但從靜態文件加載XML數據和加載動態數據應該沒什麼區別。我在你的代碼中看到的一個可疑部分是@Scripts.Render(「〜/ bundles/jquery」)**,**之前明確包含了jQuery和jQuery UI。它可能會覆蓋以前的一些設置。您可以放置'$(function(){...});'並將Javascript代碼移至'
'。您之前發佈的錯誤號非常奇怪。它顯示錯誤發生在'reloadGrid'裏面。它不存在於您發佈的代碼中。 – Oleg