我需要在jqGrid单搜索对话框中设置默认列选择。
可用选项在the jqGrid wiki
中有所描述要设置默认搜索“type”选项,我首先在数组中重新排序了“ sopt ”数组,其中包含我需要的值(“contains”,“cn”)并设置此项在navGrid
搜索选项上。尽管浏览了源代码,但我还是无法确定哪个属性可能会影响初始字段选择。它始终默认为我colModel
中的第一列。
我的代码是:
$('#tableid').jqGrid({
colNames: ['ID', 'Membership#', 'Join Date', 'Email', 'Name', 'Address', 'Postcode'],
colModel: [
{name:'ID', index:'ID', hidden:true },
{name:'MEMID', index:'MEMD', width:90 },
{name:'JOINDATE', index:'JOINDATE', width:70 },
{name:'EMAIL', index:'EMAIL', width:150, align:"right" },
{name:'NAME', index:'NAME', width:120, align:"right" },
{name:'ADDRESS', index:'ADDRESS', width:250, align:"right" },
{name:'POSTCODE', index:'POSTCODE', width:80, align:"right" }
],
// etc. ...
});
$("#tableid").jqGrid('navGrid', '#pager',
{ /* parameters */
edit:false, add:false, del:false, searchtext:'Find ', refreshtext:'Refresh '
},
{ /* edit options */ },
{ /* add options */ },
{ /* delete options */ },
{ /* search options */
multipleSearch:false,
multipleGroup:false,
showQuery:false,
top: 190,
left: 200,
caption: "Search for members...",
closeAfterSearch: false,
sopt: ['cn','nc','eq','ne','lt','le','gt','ge','bw','bn','in','ni','ew','en'],
},
{ /* view options */ }
);
当用户点击“查找”时,我希望初始默认搜索对话框显示为“名称”,选择“包含”。
答案 0 :(得分:3)
这是一个很好的问题! jqGrid包含可用于实现您的需求的选项columns
,但该选项的使用并不简单。所以我为你做了演示。
The option columns
可能没有记录,因为它不是真正用户友好的。选项columns
可以包含colModel
项的数组。确切地说,相同顺序的项目将用于构造具有列名称的下拉选择。默认情况下,jqGrid填充columns
,其中colModel
的所有项目都没有search: false
属性。对于隐藏列(具有hidden: true
),将另外测试searchoptions.searchhidden
属性(请参阅源代码的the part)。因此,选项columns
将在默认情况下在内部填充。另一方面,可以覆盖选项columns
以具有搜索字段的自定义顺序。
您在问题文本中包含的代码生成了以下搜索对话框
填写选项columns
后,您可以将其更改为例如以下
相应的演示是here。代码中最重要的部分是
var $grid = $('#tableid'),
getColumnByName = function (colName) {
var colModel = $.extend([], this.jqGrid("getGridParam", "colModel")),
colNames = $.extend([], this.jqGrid("getGridParam", "colNames")),
l = colModel.length, i, cm;
for (i = 0; i < l; i++) {
cm = colModel[i];
if (cm.name === colName) {
cm.label = cm.label || colNames[i];
return cm;
}
}
};
$grid.jqGrid({
colNames: ['ID', 'Membership#', 'Join Date', 'Email', 'Name', 'Address', 'Postcode'],
colModel: [
{name: 'ID', hidden: true },
{name: 'MEMID', width: 90 },
{name: 'JOINDATE', width: 70 },
{name: 'EMAIL', width: 150, align: "right" },
{name: 'NAME', width: 120, align: "right" },
{name: 'ADDRESS', width: 250, align: "right" },
{name: 'POSTCODE', width: 80, align: "right" }
],
...
});
$grid.jqGrid('navGrid', '#pager',
{ /* parameters */
edit:false, add:false, del:false, searchtext:'Find ', refreshtext:'Refresh '
},
{ /* edit options */ },
{ /* add options */ },
{ /* delete options */ },
{ /* search options */
...
columns: [
getColumnByName.call($grid, 'NAME'),
getColumnByName.call($grid, 'EMAIL'),
getColumnByName.call($grid, 'JOINDATE'),
getColumnByName.call($grid, 'MEMID'),
getColumnByName.call($grid, 'ADDRESS'),
getColumnByName.call($grid, 'POSTCODE')
]
},
{ /* view options */ }
);
更新:单值搜索(multipleSearch: true
未设置)和columns
选项设置存在小错误。在the answer中,我描述了如何修复错误。或者,您可以使用multipleSearch: true
选项,并在filters
中使用默认搜索规则指定postData
(请参阅相同的答案)。