选择框复选菜单 - 禁用"全选"

Question

我有一个带有大量条目的SelectCheckBoxMenu（Primefaces组件）。但是，用户只允许选择最多3个项目。SelectCheckBoxMenu几乎满足我所有的要求，唯一的问题是它提供了选择所有项目的可能性，在这种情况下显然不需要。

有没有可能禁用“全选”选项？我正在使用事件检查最多3个条目的条目。我认为我可以对“全选”执行相同的操作，并不允许他们进行选择，但我根本不想要“全选”选项。

以下是代码：

<p:selectCheckboxMenu value="#{services.titelId}" id="titel" 
            panelStyle="width:160px;" rendered="#{!services.isFirma()}"
            label="#{services.prepareTitel()}" style="width:160px;"
            styleClass="checkbox">
            <f:selectItems value="#{meta.getAkadTitelList()}" />
            <p:ajax event="change" listener="#{services.validateTitel()}"
                update="titel" process="@this" />
            <p:ajax event="toggleSelect" update="titel" process="@this" />
</p:selectCheckboxMenu>

此外，primefaces-showcase示例的链接为： https://www.primefaces.org/showcase/ui/input/checkboxMenu.xhtml

- leostiw

---

那个东西不是下拉框。你的CSS类名具有误导性，不易于自我记录。 - BalusC

是的，你说得对。我已经修改了它。 - leostiw

Answer 1

在PrimeFaces 5.0下，之前的答案对我无效，因此我深入查看了生成的HTML代码，并找到了PF5的解决方案。

要删除“全选”复选框，请按如下进行：

.without-selectall .ui-selectcheckboxmenu-header .ui-chkbox {
    display: none; 
}

现在请使用panelStyleClass属性替代styleClass：

<p:selectCheckboxMenu ...
    panelStyleClass="without-selectall"
>

- stg

---

简单而完美的解决方案，谢谢！ - Muhammad Hewedy

Answer 2

您可以将CSS规则添加到您的CSS文件中。

#titel .ui-chkbox .ui-widget {
     display:none;
}

您应该在您的中添加prependId="false"，或者如果您不想添加prependId="false"，您可以将#titel .ui-chkbox .ui-widget选择器更改为类似于#myForm\3A titel .ui-chkbox .ui-widget（来处理: id分隔符）。如果您想要完全删除筛选行，则可以设置

<p:selectCheckboxMenu filter="false"....

- Daniel

---

一如既往地感谢您，我尝试了两种选项，但都没有成功。不过，您让我找对了方向，CSS规则就是答案。我从复选框菜单中“删除”了标题，这很有意义，正是我所需要的。.ui-selectcheckboxmenu-header { display: none; } 我更改了PrimeFaces CSS，因为它对我的项目有意义，但如果其他人遇到相同的问题，请注意，只为您需要的选择框菜单进行更改。再次感谢您，Daniel。 - leostiw

你最好不要更改primefaces的CSS，而是将此规则添加到您自己的CSS文件中，并确保它是最后加载的...这样它就会覆盖primefaces的CSS... - Daniel

哦，抱歉，我表达得不好，我没有改变primefaces.css，我是在我的自定义css中添加了这段代码。 - leostiw

你也可以只使用一个类名。例如<p:selectCheckboxMenu styleClass="without-selectall">，然后使用.ui-selectcheckboxmenu.without-selectall来代替#titel。这样更具可重用性。 - BalusC

是的，这是最好的方法，这就是我在第一次回复中想要表达的意思：对于其他人来说，最好使用自己的CSS声明。 - leostiw

@BalusC，你的解决方案在PF 6.2中无法工作，因为该类未复制到面板... - Betlista

Answer 3

您可以添加<p:selectCheckboxMenu showHeader="false"......

- Ashwini