根据<p:selectOneRadio>的选定值切换<p:panel>

Bru*_*eso 2 jsf primefaces

我想在用户选择特定单选按钮时切换隐藏面板.使用最新版本的primefaces.

例如:

<p:panel id="panel1" visible="false" widgetVar="firePanel" closable="true" toggleable="true">
 hello
</p:panel>

<p:selectOneRadio value="#{formBean.selectedOptions}" layout="pageDirection">
  <f:selectItem itemLabel="Option 1" itemValue="opt1" />
  <f:selectItem itemLabel="Option 2" itemValue="opt2" />
  <f:selectItem itemLabel="Option 3" itemValue="opt"/>                           
</p:selectOneRadio>
Run Code Online (Sandbox Code Playgroud)

我想实现这样的东西,但是当点击RadioButton3时,不使用commandButton

<p:commandButton id="but" value="Show" onclick="firePanel.show();"/>
Run Code Online (Sandbox Code Playgroud)

这甚至可能吗?谢谢!

kol*_*sus 5

采取以下步骤:

  1. boolean在您的支持bean中声明一个变量来管理面板的状态并将其绑定到visible面板的属性

    boolean panelIsVisible;
    //getter and setter
    
    Run Code Online (Sandbox Code Playgroud)
    <p:panel id="panel1" visible="#{formBean.panelIsVisible}" widgetVar="firePanel" closable="true" toggleable="true">
    
    Run Code Online (Sandbox Code Playgroud)
  2. 定义一个方法,根据值的值切换可见性布尔值 selectedOptions

    public void changePanelState(){
    
        //set panelIsVisible to true or false based on whatever conditions you choose
    
    }
    
    Run Code Online (Sandbox Code Playgroud)
  3. <p:ajax/>事件添加到您<p:selectOneRadio/>可以在该菜单上的任何选择上触发ajax事件

    <p:selectOneRadio value="#{formBean.selectedOptions}" layout="pageDirection">
      <f:selectItem itemLabel="Option 1" itemValue="opt1" />
      <f:selectItem itemLabel="Option 2" itemValue="opt2" />
      <f:selectItem itemLabel="Option 3" itemValue="opt"/> 
      <p:ajax listener="#{formBean.changePanelState}" update="panel1"/>                          
    </p:selectOneRadio>
    
    Run Code Online (Sandbox Code Playgroud)

    这假设与selectOneRadio panel1相同<h:form/>.

  • 你也可以使用`visible ="#{formBean.selectedOptions =='opt'}"`而不需要额外的属性和监听器. (3认同)