jqGrid 多选 - 仅使用复选框限制行的选择

Posted

技术标签:

【中文标题】jqGrid 多选 - 仅使用复选框限制行的选择【英文标题】:jqGrid multiselect - limit the selection of the row only using the checkbox 【发布时间】:2011-11-29 11:05:19 【问题描述】:

早上好,我正在开发一个激活多选的 jqGrid。

我只需要使用 multisel 框来限制对行的选择,而不是通过单击行上的任何位置。 那是因为我需要通过单击某些单元格上的链接来执行一些操作,并且我不会更改活动的多选。 我试图设置 multiboxonly 属性,但这不是我需要的。 我没有找到其他任何东西可以自定义网格的这个功能。

【问题讨论】:

【参考方案1】:

您可以根据您的自定义beforeSelectRow 事件处理程序控制将在哪个单击上选择行。如果处理程序返回 true,则将选择该行。如果返回 false,则不会选择该行。

beforeSelectRow的第二个参数是event object,e.target是被点击的DOM元素。您可以使用$(e.target).closest('td') 获取单击完成的单元格(<td>)。然后您可以使用$.jgrid.getCellIndex 来获取该行的单元格insido 的索引。 colModel 中的索引应指向包含复选框的“cb”列。所以代码可能如下:

beforeSelectRow: function (rowid, e) 
    var $myGrid = $(this),
        i = $.jgrid.getCellIndex($(e.target).closest('td')[0]),
        cm = $myGrid.jqGrid('getGridParam', 'colModel');
    return (cm[i].name === 'cb');

对应的demo大家可以看here。

【讨论】:

非常感谢,正是我需要的。 @Oleg:非常好,但它会阻止 onSelectRow 被触发。任何建议如何保持行选择(即黄色等),但也只能通过单击复选框启用多选。 @AndrewWhite:对不起,但我不确定你的意思。如果您从beforeSelectRow 返回false,您将停止选择并且onSelectRow 不会被调用。如果您返回true,它将被调用。因此,您可以完全控制行的选择。在the answer 中,您将找到演示一些多选选项如何工作的演示。 @Oleg:谢谢,multiboxonly:解决方案是真的【参考方案2】:

我想建议更简单的解决方案:

beforeSelectRow: function(rowid, e)  
   return $(e.target).is('input[type=checkbox]');
,

【讨论】:

如果您在该行中只有一个复选框,这将起作用。如果网格中存在任何其他带有复选框的列,并且如果用户单击它......那么它也会受到影响......所以在实施时要小心。【参考方案3】:

当 multiselect 设置为 true 时,单击行上的任意位置都会选择该行;当 multiboxonly 也设置为 true 时,仅当单击复选框时才会进行多选。 所以答案是:

multiboxonly: true

【讨论】:

以上是关于jqGrid 多选 - 仅使用复选框限制行的选择的主要内容,如果未能解决你的问题,请参考以下文章

jqgrid复选框全选,全部清除

vb中multiselect=2和0怎么都是单选?multiselect=2怎么使用才能产生多选效果?

仅获取从 jqgrid 表中删除的行的“id”[关闭]

按下特殊键时的jqGrid多选行为

JS在页面限制checkbox最大复选数

如何使复选框作为多选选项?