如何使用 jQuery 修改一组具有相同 class 的 p:selectBooleanCheckboxes?

How can I modify a group of p:selectBooleanCheckboxes with the same class using jQuery?

我有一个 PrimeFaces p:selectBooleanCheckbox:

<p:selectBooleanCheckbox styleClass="myCLass" onchange="callsMethod();" value="true" />

我想要这样的东西: $('.myCLass').prop( 'checked', true ) 用于动态设置 p:selectBooleanCheckbox 的值。

这比使用 widgetVar 简单多了。

  1. 将 widgetVar 添加到您的组件,例如...
<p:selectBooleanCheckbox widgetVar="wgtMyCheckBox" onchange="callsMethod();"  />
  1. 在您的 Javascript 代码中使用 WidgetVar 获取或设置值。
    PF('wgtMyCheckBox').isChecked(); -- returns current state
    PF('wgtMyCheckBox').check(); -- checks the box
    PF('wgtMyCheckBox').uncheck(); -- unchecks the box
    PF('wgtMyCheckBox').toggle(); -- toggles the current state to the opposite state

如果您想选中屏幕上的所有复选框,您可以在小部件上循环。

for (var widgetVar in PrimeFaces.widgets) {
   var widget = PrimeFaces.widgets[widgetVar];
   if (widget && widget instanceof PrimeFaces.widget.SelectBooleanCheckbox) { 
       widget.check();
   }
}

您可以使用 PrimeFaces.getWidgetById 方法为分配了您的 styleClass 的每个复选框获取 Primefaces 小部件:

切换具有 styleClass="myCLass":

的所有复选框
$('.myCLass').each(function(){PrimeFaces.getWidgetById(this.id).toggle()});

勾选所有 styleClass="myCLass":

的复选框
$('.myCLass').each(function(){PrimeFaces.getWidgetById(this.id).check()});

取消选中具有 styleClass="myCLass":

的所有复选框
$('.myCLass').each(function(){PrimeFaces.getWidgetById(this.id).uncheck()});