我正在使用JQGrid(版本5.3.0)来显示动态表格中的值(我事先并不知道列号和列名称)。我从ajax调用服务器中检索列模式,以及需要应用于网格的过滤器,并从那里创建JQGrid。
我遇到的问题是我找不到从传递给表的过滤器中正确重新填充过滤器工具栏的方法。
代码如下:
$.ajax({
url: {url to get columns and filter},
type: 'POST',
postData: { productID: 98 }
success: function (result) {
if (result) {
$('#grid').jqGrid({
url: {url to get data},
datatype: 'json',
search: true,
postData: { productID: 98, filters: result.filter },
myType: 'GET',
colModel: result.columns,
jsonReader: {
root: 'Data',
page: 'Page',
total: 'Total',
records: 'PageSize'
},
pager: $('#gridpager'),
rowNum: 25,
gridview: false,
afterInsertRow: function (rowid, rowdata, rowelem) {
var color = rowelem.Color;
if (color != 'white') {
$("tr.jqgrow#" + rowid).addClass("color-" + color);
}
},
}).filterToolbar({
groupOp: 'AND',
defaultSearch: "cn",
searchOnEnter: true,
searchOperators: true,
stringResult: true,
});
}
}
});
以下是Columns模型的示例:
[
{
"name":"DESCRIPTION",
"label":"Description",
"searchoptions":
{
"sopt": ["bw","cn","nc","ew","eq","ne","in"],
"attr":{"class":"glyphicon glyphicon-filter"}
}
},
{
"name":"SKU_CODE",
"label":"SKU Code",
"searchoptions":
{
"sopt":["bw","cn","nc","ew","eq","ne","in"],
"attr":{"class":"glyphicon glyphicon-filter"}
}
},
{...}
]
这是过滤器:
"{\"groupOp\":\"AND\",\"rules\":[{\"field\":\"DESCRIPTION\",\"op\":\"bw\",\"data\":\"D\"}]}"
执行此代码时,数据从我的数据源加载,应用过滤器,但过滤器栏保持为空。
有没有办法使用参数中传递的过滤器的值自动填充过滤器工具栏?我已经尝试过解析过滤规则,并用匹配的值填充输入,但我找不到恢复操作符的方法。
答案 0 :(得分:1)
如果您在不支持searchOperators的情况下使用现有方法,则代码应如下所示:
$("#grid").jqGrid({
...
}).filterToolbar({
groupOp: 'AND',
defaultSearch: "cn",
searchOnEnter: true,
searchOperators: true,
stringResult: true
}).refreshFilterToolbar({"filters": result.filter});
如果您使用github中支持searchOperators的版本,那么您的代码应该是这样的
$("#grid").jqGrid({
...
}).filterToolbar({
groupOp: 'AND',
defaultSearch: "cn",
searchOnEnter: true,
searchOperators: true,
stringResult: true
}).refreshFilterToolbar();
请注意,我们不会传递filter参数,该参数会自动获取。
在您的情况下,您可以使用 rowattr 事件来实现此目的。请在同一文档页面中阅读更多相关信息。不要忘记将gridview设置为true或其他单词
...
rowNum: 25,
gridview: true,
rowattr: function (rowdata, rowelem) {
var color = rowelem.Color;
if (color != 'white') {
return { "class" : "color-" + color};
}
},