Как отключить вкладку PrimeFaces при выборе флажка - PullRequest
Новая
       0

Как отключить вкладку PrimeFaces при выборе флажка

3 голосов
/ 21 декабря 2011

Я использую Primefaces 2.2.У меня есть p: tabView с тремя вкладками внутри.Tab1 содержит логический флажок.Теперь я хочу, чтобы когда пользователь нажимал на флажок на вкладке 1, вкладка 2 становилась отключенной.Как мне это сделать?Вот предварительный просмотр кода. 

<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>

Спасибо

Ответы [ 2 ]

1 голос
/ 22 декабря 2011

Вот как я это сделал. 

 <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
1 голос
/ 21 декабря 2011 
<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>

Таким образом, у вас должен быть компонент формы, и, как вы можете видеть, вы можете использовать простые лица ajax и атрибут update ... метод / слушатель myMethodEvaluatingDisabledTabs используется для изменения логического значения, используемого атрибутом disabled на каждой вкладке : поэтому вы изменяете на disabled=true для каждой вкладки, которую вы хотите (в этом случае у вас будет 3 булевых переменных), а затем обновляете всю форму.

PS: Я должен проверить это событие ajax ....

...