jqgrid searchGrid
时间: 2023-08-23 21:28:45 浏览: 121
jqGrid搜索
4星 · 用户满意度95%
`searchGrid` 方法是 jqGrid 提供的一个用于触发搜索的 API,可以在 JavaScript 中调用。使用 `searchGrid` 方法,您可以在 JavaScript 中自定义搜索条件,并将其应用于 jqGrid。
下面是一个例子:
```javascript
$("#grid").jqGrid({
url: 'data.json',
datatype: 'json',
colModel: [
{ name: 'id', index: 'id', width: 60 },
{ name: 'name', index: 'name', width: 90 },
{ name: 'amount', index: 'amount', width: 80, align: 'right' },
{ name: 'price', index: 'price', width: 80, align: 'right' }
],
jsonReader: {
repeatitems: false,
id: 'id'
},
pager: '#pager',
rowNum: 10,
rowList: [10, 20, 30],
sortname: 'id',
sortorder: 'asc',
viewrecords: true,
caption: 'My Grid',
height: '100%',
autowidth: true,
}).navGrid('#pager', { edit: false, add: false, del: false, search: true })
.navButtonAdd('#pager', {
caption: 'Custom Search',
buttonicon: 'ui-icon-search',
onClickButton: function () {
var postData = { };
postData.name = { op: 'bw', data: 'Product' };
postData.amount = { op: 'gt', data: '100' };
$("#grid").jqGrid('setGridParam', { postData: postData });
$("#grid").jqGrid('searchGrid', { multipleSearch: true });
}
});
```
在上面的例子中,我们设置了一个包含四个列的 jqGrid,并在 `navGrid` 中启用了搜索功能。我们还定义了一个自定义搜索按钮,当用户点击该按钮时,将触发一个 JavaScript 函数。在该函数中,我们定义了一个名为 `postData` 的对象,该对象包含要应用的搜索条件。然后,我们使用 `setGridParam` 方法将搜索条件设置为网格的 `postData` 属性。最后,我们使用 `searchGrid` 方法触发搜索,将搜索条件应用于网格。
在 `searchGrid` 方法中,我们还可以传递一个包含其他选项的对象,例如 `multipleSearch`,该选项指定是否允许多个搜索条件。
使用 `searchGrid` 方法,您可以在 JavaScript 中自定义搜索条件,并将其应用于 jqGrid,而不需要用户手动输入搜索条件。这样,您可以在网格中实现更高级的搜索功能。
阅读全文