How to disable PrimeFaces tab on checkbox selection

Question

I am using Primefaces 2.2. I have p:tabView with three tabs inside it. Tab1 contains a boolean checkbox. Now i want that when user click on checkbox in tab1, then tab 2 become disable. How can i do it? Here is the code preview.

<h:body>

    <p:panel header="F.C. Barcelona" footer="Visca el Barca!">

        <p:tabView>

            <p:tab id="tab1"  title="Godfather Part I">
                <h:panelGrid columns="2" cellpadding="10">  
                    <h:outputText value="In tab1." />
                </h:panelGrid>

                <h:selectBooleanCheckbox id="Mark"
                                         value="#{disableTag.disable}" >
                    <f:ajax render="tab2"  />
               </h:selectBooleanCheckbox>

            </p:tab>

            <p:tab id="tab2" title="Godfather Part II">
                <h:panelGrid columns="2" cellpadding="10">

                    <h:outputText value="In tab2." />
                </h:panelGrid>
            </p:tab>

            <p:tab id="tab3" title="Godfather Part III">
                <h:panelGrid columns="2" cellpadding="10">

                    <h:outputText value="In tab3." />
                </h:panelGrid>
            </p:tab>

        </p:tabView>

    </p:panel>

</h:body>

Thanks

Answer 1

Here how i did it.

 <h:head>
    <title>Facelet Title</title>
</h:head>
<h:body>
    <h:form>

        <p:panel id="myPanel" header="F.C. Barcelona" footer="Visca el Barca!">

            <p:tabView id="myTabView" tabChangeListener="#{disableTag.onChange}" >

                <p:tab  id="tab1"  title="Godfather Part I">
                    <h:panelGrid columns="2" cellpadding="10">
                        <p:panel header="Basit" footer="Basit">


                        </p:panel>
                        <h:outputText value="In tab1." />
                    </h:panelGrid>

                    <h:outputText value="Click to hideGodfather Part II " />
                    <h:selectBooleanCheckbox id="Mark"
                                             value="#{disableTag.disable}"
                                             valueChangeListener="#{disableTag.changeMark}">
                        <f:ajax render="@this myTabView"  />
                    </h:selectBooleanCheckbox>

                </p:tab>

                <p:tab id="tab2"
                       title="Godfather Part II"
                       rendered="#{disableTag.rendered}">
                    <h:panelGrid columns="2" cellpadding="10">

                        <h:outputText value="In tab2." />
                    </h:panelGrid>
                </p:tab>

                <p:tab id="tab3" title="Godfather Part III">
                    <h:panelGrid columns="2" cellpadding="10">

                        <h:outputText value="In tab3." />
                    </h:panelGrid>
                </p:tab>

            </p:tabView>

        </p:panel>

    </h:form>

</h:body>

@ManagedBean
@ViewScoped
public class DisableTag implements Serializable {

    private boolean disable;
    private boolean rendered;

    /** Creates a new instance of DisableTag */
    public DisableTag() {

        rendered = false;

    } //end of constructor

    public boolean isDisable() {
        return disable;
    }

    public void setDisable(boolean disable) {
        this.disable = disable;
    }

    public boolean isRendered() {
        return rendered;
    }

    public void setRendered(boolean rendered) {
        this.rendered = rendered;
    }

    public void changeMark(ValueChangeEvent vcEvent){

        rendered = Boolean.valueOf(vcEvent.getNewValue().toString()).booleanValue();
        System.out.println();

    }

} //end of class DisableTag

Answer 2

<h:form id="myFormId">     
    <p:panel header="F.C. Barcelona" footer="Visca el Barca!">

        <p:tabView>

            <p:tab id="tab1"  title="Godfather Part I" disabled="#{myBean.myBooleanFirstTabDisable}">
                <h:panelGrid columns="2" cellpadding="10">  
                    <h:outputText value="In tab1." />
                </h:panelGrid>

                <h:selectBooleanCheckbox id="Mark" 
                                         value="#{disableTag.disable}" >
                    <p:ajax event="check" update="myFormId" listener="#{myBean.myMethodEvaluatingDisabledTabs}" />
               </h:selectBooleanCheckbox>

            </p:tab>

            <p:tab id="tab2" title="Godfather Part II" disabled="#{myBean.myBooleanSecondTabDisable}">
                <h:panelGrid columns="2" cellpadding="10">

                    <h:outputText value="In tab2." />
                </h:panelGrid>
            </p:tab>

            <p:tab id="tab3" title="Godfather Part III" disabled="#{myBean.myBooleanThirdTabDisable}">
                <h:panelGrid columns="2" cellpadding="10">

                    <h:outputText value="In tab3." />
                </h:panelGrid>
            </p:tab>

        </p:tabView>

    </p:panel>
</h:form>

So you have to have a form component and as you can see you can use primefaces ajax and update attribute... the method/listener myMethodEvaluatingDisabledTabs is used for changing the boolean value used by disabled attribute in each tab: so you change to disabled=true for every tab you want (you will have 3 boolean variables in this case) and then update the entire form.

PS: I have to check about that ajax event....