I had this requirement these days: We have a table with many rows among which some are selectable and some are not selectable, and there is also a selecting-all button which should support do/cancel selecting all selectable rows. But after glancing over the old project, I found no similar ready-made code, so I search for this by Baidu, and found solution like below (modified and beautified):
var $jqGrid = $('#grid-table'); options.multiselect = true; // 点击全选时触发事件 options.onSelectAll = function (rowid, status) { // 获取jqgrid中所有数据行的id var rowIds = $jqGrid.jqGrid('getDataIDs'); for (var k = 0; k < rowIds.length; k++) { // 获取指定id所在行的所有数据 var curRowData = $jqGrid.jqGrid('getRowData', rowIds[k]); if (如果curRowData中的数据表明该行不允许进行选中的话) { // 设置改行不能被选中 $jqGrid.jqGrid('setSelection', rowIds[k], false); } } } // 选择某行时触发事件 options.onSelectRow = function (id) { var curRowData = $jqGrid.jqGrid('getRowData', id); if (如果curRowData中的数据表明该行不允许进行选中的话) { // 设置改行不能被选中 $jqGrid.jqGrid('setSelection', id, false); } }
The above code seems to work well at first attempt. But you will find that you can not undo the selecting-all operation. I cannot use google for several months, therefore I use bing to search for other solutions, and thank goodness, here are the solution:
options.multiselect = true; options.rowattr = function (item) { if (getString(item.status) !== '1') { return {'class': 'ui-state-disabled ui-jqgrid-disablePointerEvents'}; } }; options.beforeSelectRow = function (rowid, e) { return !$(e.target).closest('tr.jqgrow').hasClass('ui-state-disabled'); };
Haha! I really think the api document for jqgrid plugin is too complicated that it scares me to earnestly read it.