我正在研究jqgrid。我想为jqgrid工具栏添加刷新按钮以刷新网格。
这是我的js代码:
jQuery(document).ready(function () {
var grid = jQuery("#gridemp");
grid.jqGrid({
url: '/Admin/GetTimeInOut_ForAdmin',
datatype: 'json',
mtype: 'Post',
height: '100%',
multipleSearch: false,
rownumbers: true,
//formatCell: emptyText,
colNames: ['User', 'Date', 'TimeIn', 'TimeOut'],
colModel: [
{ name: 'User', index: 'User', align: "center", sorttype: 'text', resizable: true, editable: false },
{ name: 'Date', index: 'Date', align: "center", sorttype: 'text', resizable: true, editable: false, searchoptions: { dataInit: function (el) { $(el).datepicker({ dateFormat: 'mm/dd/yy' }).change(function () { $('#gridemp')[0].triggerToolbar(); }); } } },
{ name: 'TimeIn', index: 'TimeIn', align: "center", sorttype: 'text', resizable: true, editable: false },
{ name: 'TimeOut', index: 'TimeOut', align: "center", sort:false, resizable: true, editable: false }
],
//shrinkToFit: true,
// loadonce: false,
//ignoreCase: true,
width: '690',
pager: '#emppager',
caption: 'Employee Time IN/OUT',
rowNum: 10,
rowList: [10, 20, 50, 100],
viewrecords: true,
hidegrid: false,
}
);
grid.jqGrid('filterToolbar',{ stringResult: true, searchOnEnter: true, defaultSearch: 'cn' });
grid.jqGrid('navGrid', '#emppager',
{ resize: false, add: false, search: false, del: false, refresh: false, edit: false, alerttext: 'Please select one user' }
).jqGrid('navButtonAdd', '#pager');
});
实际上我需要2个刷新按钮,一个用于清除搜索栏文本框而不刷新jqgrid,另一个用于刷新整个网格。如果它适合我,我会标记你的答案。提前致谢。快乐编码:),如果你的问题不清楚请评论我会解释。
答案 0 :(得分:4)
首先,您的代码似乎包含输入错误:您在创建网格期间使用pager: '#emppager'
,navGrid
但不在navButtonAdd
。
要添加“标准”重新加载按钮以重置过滤器工具栏并重新加载网格,您只需删除refresh: false
选项。
要添加自定义清除过滤器,您需要按照以下方式调用navButtonAdd
.jqGrid("navButtonAdd", "#emppager", {
caption: "", // no text near the button
title: "Clear filters in toolbar without reloading of data",
buttonicon: "ui-icon-close", // an example of icon
onClickButton: function () {
this.clearToolbar(false); // don't reload grid
}
});
您可以按使用refreshicon
选项更改“刷新”按钮使用的图标(位于指定del
,refresh
,alerttext
等的位置。默认值为refreshicon: "ui-icon-refresh"
。此外,您可以考虑使用refreshstate: "current"
(默认为refreshstate: "firstpage"
)。