jqGrid postData.filters is undefined
jqGrid postData.filters is undefined
我需要自定义jqGrid。但是postData.Filters是未定义的。由于我是jquery和javascript的新手，即使经过一天的努力，我也无法找出问题的确切原因。
我正在使用以下javascript。
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.24/themes/redmond/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="http://www.ok-soft-gmbh.com/jqGrid/jquery.jqGrid-4.4.1/css/ui.jqgrid.css" />
<link rel="stylesheet" type="text/css" href="http://www.ok-soft-gmbh.com/jqGrid/jquery-ui-multiselect/1.13.6/jquery.multiselect.css" />
<style type="text/css">
html, body {
font-size: 75%;
}
.ui-multiselect-menu {
font-size: 1.2em;
}
.ui-jqgrid .ui-jqgrid-htable .ui-search-toolbar th {
height: auto;
}
</style>
<script src="js/jquery-1.11.0.min.js"></script>
<script src="js/jquery.jqGrid.min.js"></script>
<script src="js/jquery.jqGrid.src.js"></script>
<script src="js/i18n/grid.locale-en.js"></script>
<script type="text/javascript">
$.jgrid.no_legacy_api = true;
$.jgrid.useJSON = true;
</script>
<script type="text/javascript">
$(function () {
'use strict';
var jsonData = {
"Employees": [
{
"Emp ID": 1.0,
"Name": "Anubhav",
"Gender": "Male",
"Department": "DEVELOPMENT",
"Company": "SOPRA",
"Salary": 100000
},
{
"Emp ID": 2.0,
"Name": "Shailesh",
"Gender": "Male",
"Department": "DEVELOPMENT",
"Company": "SOPRA",
"Salary": 10000
},
{
"Emp ID": 3.0,
"Name": "Deepak",
"Gender": "Male",
"Department": "SALES",
"Company": "ROQUETTE",
"Salary": 20000
},
{
"Emp ID": 4.0,
"Name": "Seema",
"Gender": "Female",
"Department": "PURCHASE",
"Company": "ROQUETTE",
"Salary": 25000
}
]},
$grid = $("#list2"),
myDefaultSearch = 'cn',
getColumnIndexByName = function (columnName) {
var cm = $(this).jqGrid('getGridParam', 'colModel'), i, l = cm.length;
for (i = 0; i < l; i += 1) {
if (cm[i].name === columnName) {
return i; // return the index
}
}
return -1;
},
modifySearchingFilter = function (separator) {
var i, l, rules, rule, parts, j, group, str, iCol, cmi, cm = this.p.colModel;
window.alert("Hello");
window.alert(this.p.postData.filters);
var filters = $.parseJSON(this.p.postData.filters);
window.alert("Hello 2");
if (filters && filters.rules !== undefined && filters.rules.length > 0) {
rules = filters.rules;
for (i = 0; i < rules.length; i++) {
rule = rules[i];
iCol = getColumnIndexByName.call(this, rule.field);
cmi = cm[iCol];
if (iCol >= 0 &&
((cmi.searchoptions === undefined || cmi.searchoptions.sopt === undefined)
&& (rule.op === myDefaultSearch)) ||
(typeof (cmi.searchoptions) === "object" &&
$.isArray(cmi.searchoptions.sopt) &&
cmi.searchoptions.sopt[0] === rule.op)) {
// make modifications only for the 'contains' operation
parts = rule.data.split(separator);
if (parts.length > 1) {
if (filters.groups === undefined) {
filters.groups = [];
}
group = {
groupOp: 'OR',
groups: [],
rules: []
};
filters.groups.push(group);
for (j = 0, l = parts.length; j < l; j++) {
str = parts[j];
if (str) {
// skip empty '', which exist in case of two separaters of once
group.rules.push({
data: parts[j],
op: rule.op,
field: rule.field
});
}
}
rules.splice(i, 1);
i--; // to skip i++
}
}
}
this.p.postData.filters = JSON.stringify(filters);
}
},
dataInitMultiselect = function (elem) {
setTimeout(function () {
var $elem = $(elem), id = elem.id,
inToolbar = typeof id === "string" && id.substr(0, 3) === "gs_",
options = {
selectedList: 2,
height: "auto",
checkAllText: "all",
uncheckAllText: "no",
noneSelectedText: "Any",
open: function () {
var $menu = $(".ui-multiselect-menu:visible");
$menu.width("auto");
return;
}
},
$options = $elem.find("option");
if ($options.length > 0 && $options[0].selected) {
$options[0].selected = false; // unselect the first selected option
}
if (inToolbar) {
options.minWidth = 'auto';
}
$elem.multiselect(options);
$elem.siblings('button.ui-multiselect').css({
width: inToolbar ? "98%" : "100%",
marginTop: "1px",
marginBottom: "1px",
paddingTop: "3px"
});
}, 50);
};
$grid.jqGrid({
datatype: "json",
data: jsonData,
colNames: ["Emp ID", "Name", "Department", "Company", "Salary"],
colModel: [
{ name: "Emp ID", sorttype: 'integer' },
{ name: "Name" },
{
name: "Department", width: 100, align: 'center', formatter: 'select', edittype: 'select', stype: 'select',
editoptions: { value: 'DEVELOPMENT;SALES;PURCHASE', defaultValue: 'DEVELOPMENT', multiple: true },
searchoptions: { sopt:['eq', 'ne'], value: 'DEVELOPMENT;SALES;PURCHASE', attr: { multiple: 'multiple', size: 4 }, dataInit: dataInitMultiselect }
},
{ name: "Company" },
{ name: "Salary", sorttype: 'integer' }
],
cmTemplate: { editable: false },
rowNum: 10,
mtype: "GET",
rowList: [10, 20, 100],
pager: "#pager2",
height: "auto",
viewrecords: true,
gridview: true,
ignoreCase: true,
rownumbers: true,
cellEdit: true,
cellsubmit: "clientArray",
editurl: "clientArray",
sortname: 'Emp ID',
caption: "CDDI Sample Grid",
beforeRequest: function () {
modifySearchingFilter.call(this, ',');
}
});
$grid.jqGrid('filterToolbar', {search:true, searchOperators: true, stringResult: true, searchOnEnter: true, defaultSearch: 'cn' });
$grid.jqGrid('navGrid', '#pager2', { edit: false, add: false, del: false, search: true }, {}, {}, {}, {
multipleSearch: true,
multipleGroup: true,
recreateFilter: true
});
});
</script>
</head>
<body>
<table id="list2"></table>
<div id="pager2"></div>
</body>
</html>
我看到您使用了我以前的答案中的代码。
"jqGrid postData.filters is undefined"未定义的错误可以通过添加行轻松修复
if (postData.filters == null) {
return;
}
在线路CCD_ 2之前的CCD_。
代码中的另一个重要错误是使用了datatype: "json"而不是datatype: "local"。选项datatype: "json"意味着来自网格的数据将通过Ajax请求加载到url参数指定的URL。
还有一个错误是使用了data: jsonData而不是data: jsonData.Employees。重要的是要理解data参数的值必须是一个数组。
还有一点：我强烈建议您在modifySearchingFilter1的name属性中不要使用特殊字符（目前您有name: "Emp ID"）。name属性的值将用作网格的一些内部元素的id，但jQuery和CSS将使用空格作为分隔符和元字符（例如，请参阅此处）。因此，我建议您将name: "Emp ID"更改为name: "EmpId"，以减少将来的问题。
你将在这里被罚款的固定演示。它使用以下代码
$(function () {
"use strict";
var jsonData = {
"Employees": [
{
"EmpId": 1.0,
"Name": "Anubhav",
"Gender": "Male",
"Department": "DEVELOPMENT",
"Company": "SOPRA",
"Salary": 100000
},
{
"EmpId": 2.0,
"Name": "Shailesh",
"Gender": "Male",
"Department": "DEVELOPMENT",
"Company": "SOPRA",
"Salary": 10000
},
{
"EmpId": 3.0,
"Name": "Deepak",
"Gender": "Male",
"Department": "SALES",
"Company": "ROQUETTE",
"Salary": 20000
},
{
"EmpId": 4.0,
"Name": "Seema",
"Gender": "Female",
"Department": "PURCHASE",
"Company": "ROQUETTE",
"Salary": 25000
}
]
},
$grid = $("#list2"),
myDefaultSearch = "cn",
getColumnIndexByName = function (columnName) {
var cm = $(this).jqGrid("getGridParam", "colModel"), i, l = cm.length;
for (i = 0; i < l; i += 1) {
if (cm[i].name === columnName) {
return i; // return the index
}
}
return -1;
},
modifySearchingFilter = function (separator) {
var i, l, rules, rule, parts, j, group, str, iCol, cmi, filters,
cm = $(this).jqGrid("getGridParam", "colModel"),
postData = $(this).jqGrid("getGridParam", "postData");
if (postData.filters == null) {
return;
}
filters = $.parseJSON(postData.filters);
if (filters && filters.rules !== undefined && filters.rules.length > 0) {
rules = filters.rules;
for (i = 0; i < rules.length; i++) {
rule = rules[i];
iCol = getColumnIndexByName.call(this, rule.field);
cmi = cm[iCol];
if (iCol >= 0 &&
(((cmi.searchoptions === undefined || cmi.searchoptions.sopt === undefined) &&
rule.op === myDefaultSearch) ||
(typeof (cmi.searchoptions) === "object" &&
$.isArray(cmi.searchoptions.sopt) &&
cmi.searchoptions.sopt.length > 0 &&
cmi.searchoptions.sopt[0] === rule.op))) {
// make modifications only for the "contains" operation
parts = rule.data.split(separator);
if (parts.length > 1) {
if (filters.groups === undefined) {
filters.groups = [];
}
group = {
groupOp: "OR",
groups: [],
rules: []
};
filters.groups.push(group);
for (j = 0, l = parts.length; j < l; j++) {
str = parts[j];
if (str) {
// skip empty "", which exist in case of two separaters of once
group.rules.push({
data: parts[j],
op: rule.op,
field: rule.field
});
}
}
rules.splice(i, 1);
i--; // to skip i++
}
}
}
postData.filters = JSON.stringify(filters);
}
},
dataInitMultiselect = function (elem) {
setTimeout(function () {
var $elem = $(elem), id = elem.id,
inToolbar = typeof id === "string" && id.substr(0, 3) === "gs_",
options = {
selectedList: 2,
height: "auto",
checkAllText: "all",
uncheckAllText: "no",
noneSelectedText: "Any",
open: function () {
var $menu = $(".ui-multiselect-menu:visible");
$menu.width("auto");
return;
}
},
$options = $elem.find("option");
if ($options.length > 0 && $options[0].selected) {
$options[0].selected = false; // unselect the first selected option
}
if (inToolbar) {
options.minWidth = "auto";
}
$elem.multiselect(options);
$elem.siblings("button.ui-multiselect").css({
width: inToolbar ? "98%" : "100%",
marginTop: "1px",
marginBottom: "1px",
paddingTop: "3px"
});
}, 50);
};
$grid.jqGrid({
datatype: "local",
data: jsonData.Employees,
colNames: ["Emp ID", "Name", "Department", "Company", "Salary"],
colModel: [
{ name: "EmpId", sorttype: "integer", key: true },
{ name: "Name" },
{
name: "Department",
width: 160,
align: "center",
edittype: "select",
editoptions: {
value: "DEVELOPMENT:DEVELOPMENT;SALES:SALES;PURCHASE:PURCHASE",
defaultValue: "DEVELOPMENT",
multiple: true
},
stype: "select",
searchoptions: {
sopt: ["eq", "ne"],
value: "DEVELOPMENT:DEVELOPMENT;SALES:SALES;PURCHASE:PURCHASE",
attr: { multiple: "multiple", size: 4 },
dataInit: dataInitMultiselect
}
},
{ name: "Company" },
{ name: "Salary", sorttype: "integer", formatter: "integer" }
],
cmTemplate: { editable: false },
rowNum: 10,
rowList: [10, 20, 100],
pager: "#pager2",
height: "auto",
viewrecords: true,
gridview: true,
ignoreCase: true,
rownumbers: true,
cellEdit: true,
cellsubmit: "clientArray",
editurl: "clientArray",
sortname: "EmpId",
caption: "CDDI Sample Grid",
beforeRequest: function () {
modifySearchingFilter.call(this, ",");
}
});
$grid.jqGrid("filterToolbar", {
searchOperators: true,
stringResult: true,
searchOnEnter: true,
defaultSearch: myDefaultSearch
});
$grid.jqGrid("navGrid", "#pager2", { edit: false, add: false, del: false }, {}, {}, {}, {
multipleSearch: true,
multipleGroup: true,
recreateFilter: true
});
});
相关文章：
- Jquery - table.row(tr) is undefined
- noty.js is returning undefined
- $routeParams is undefined
- Angular js $scope is Undefined
- $scope is coming as undefined
- Angular - $cookies is undefined
- TypeError: e is undefined - javascript
- “google.maps.MapTypeId is undefined”在FF 14中使用GMAP3时
- chrome.storage.local["mykey"] is undefined
- 回调在 Angular2/Firebase 中生成“TypeError: this is undefined”
- KendoWindow .visible(); is undefined?
- jQuery .forEach(） 导致错误，“undefined is not a function”
- 使用“flickrnode”API时出现“TypeError: undefined is not a function”
- "undefined is not a function" onSuccessHandler
- 莫名其妙的“Undefined is not a function”错误 — 由“getElementsById”引起
- Angular js 在传递 promise 时$asyncValidator“Undefined is not a f
- undefined is not a function when evaluating 'this.batman
- “uncatch TypeError: undefined is not a function” 在使用 str.ind
- 谷歌地图API(使用gmapsjs)， setCenter抛出“undefined is not a function”
- 在骨干应用视图中出现" Uncaught TypeError: undefined is not a function
