时间戳

首页 > 解决方案 > 选择项目时动态更改 p:selectCheckboxMenu 的样式

javascript - 选择项目时动态更改 p:selectCheckboxMenu 的样式

问题描述

当用户从下拉列表中选择任何值时，我正在尝试更改 p:selectCheckboxMenu 的样式。例如更改标签容器 ( .ui-selectcheckboxmenu .ui-selectcheckboxmenu-label-container) 的背景颜色或边框颜色。
我遇到的问题是 selectCheckboxMenus 是在重复组件内动态生成的。

<h:panelGroup id="multiple" >
      <p:repeat value="#{myBean.keywdLst}" var="kLst" >
          <p:selectCheckboxMenu id="checkmenu" value="#{myBean.selectedKeywords}" 
                  label="#{kLst.keywordlistname}" filter="true" filterMatchMode="startsWith" 
                  panelStyle="width:250px" valueChangeListener="#{myBean.selectedItemsChanged}" >
                <f:selectItems value="#{kLst.listKeywords}" var="key" itemLabel="#{key.keyword}" itemValue="#{key}" />
          </p:selectCheckboxMenu>
      </p:repeat>                            
</h:panelGroup>

我不确定解决这个问题的正确方法。无论是使用 javascript 和 ajax 侦听器还是在支持 bean 中，挑战是仅获取带有所选项目的 selectCheckboxMenus 的 id，以及如何在那里推送 css 代码。

非常感谢任何帮助。
谢谢

标签： javascriptcssjsfprimefaces

解决方案

使用 a<c:forEach>而不是，<p:repeat>以便您可以在循环中获取生成的 ID 的句柄，然后使用它们。有关更多详细信息：JSF2 Facelets 中的 JSTL... 有意义吗？

推荐阅读