primefaces accordion panel within single form - validation only on opened tab

问题

I have checked around but I didn't found a clear example on how to submit the accordion using a single form. The problem I find is when I want to process (validate) only fields of the opened tab.

The structure of my page is as follows:

<h:form>
    <p:accordionPanel activeIndex="#{bean.selectedTab}">
        <p:ajax event="tabChange" listener="#{bean.tabChangeListener}"/>

        <p:tab title="Tab1" id="t1">
            <p:inputText id="reqField1" required="true"/>
        </p:tab>
        <p:tab title="Tab2" id="t2">
            <p:inputText id="reqField2" required="true"/>
        </p:tab>
   </p:accordionPanel>

   <p:commandButton update="list" immediate="true" actionListener="#{bean.addRecord}"/>                     
</h:form>

method:

@SessionScoped
public class Bean{
    public void tabChangeListener(AjaxBehaviorEvent evt){
        AccordionPanel panel = (AccordionPanel) evt.getComponent();
        // getLoadedTabs() returns an empty list
        String currentlyLoadedTabId = panel.getLoadedTabs().get(this.selectedTab).getClientId(); 

    }
}

Is there anyway to specify the id of the currently opened tab as part of the process attribute in p:commandButton tag?

UPDATE When Tab1 is open, on submit, I want to be validated only reqField1 and not reqField2. Viceversa, when Tab2 is open, I want to be validated only reqField2 and not reqField1.

回答1:

Try this.

Bind the activeIndex of the accordionPanel to a backing bean int attribute
```
activeIndex="#{myBean.selectedTab}"
```
Get the id of the currently selected tab using the bound activeIndex. To do this in your actionListener, get a handle on the accordion panel

EDIT: Since your actionListener has been set to immediate, the activeIndex and selectedTab will need to be updated via ajax. Add the following <p:ajax/> to your accordionPanel
```
<p:ajax event="tabChange" listener="#{bean.tabChangeListener}" />
```
In your backing bean, you'll now have
```
public void (AjaxBehaviorEvent evt){
 AccordionPanel panel = (AccordionPanel) evt.getComponent();
 String currentlyLoadedTabId = panel.getLoadedTabs().get(this.selectedTab).getClientId(); 

}
```
Using the the id you got from 2 above, you can include that in the JSF list of things to be rerendered using ajax on the server side. In the same action listener method:
```
 FacesContext.getCurrentInstance().getPartialViewContext().getRenderIds().add(currentlyLoadedTabId);
```

Alternatively, you might just consider placing a command button in each of those tabs and having a form in each tab as well. This way, each command button processes only it's own parent form

来源：https://stackoverflow.com/questions/13324380/primefaces-accordion-panel-within-single-form-validation-only-on-opened-tab

标签

jsf

primefaces

validation

accordion