Как показать диалоговое окно при нажатии на определенную вкладку в tabView PrimeFaces

Я новичок в jsf и использую Primefaces 4.0 для написания tabView. Я хочу что-то сделать в моем Backing Bean при нажатии на определенную вкладку, поэтому я попробовал это:

страница:

<p:tabView effect="fade" effectDuration="normal">
            <p:ajax event="tabChange" listener="#{myConsoleBean.onTabChange}" update=":rightForm"/>

            <p:tab title="My">
            </p:tab>
            <p:tab id="statTab" title="Stat">
            </p:tab>
        </p:tabView>

Поддерживающий компонент:

public void onTabChange(final TabChangeEvent event) {
            TabView tv = (TabView) event.getComponent();
            int activeTabIndex = tv.getActiveIndex();
            System.out.println(activeTabIndex);
            if(activeTabIndex==1)//Stat tab clicked
            {                    
                //do something here...
            }
   }

Все работает до сих пор, но Backing Bean по какой-то причине работает медленно, я хочу показать диалоговое окно, которое содержит индикатор выполнения, в то время как Backing Bean прогрессирует:

Диалог такой:

<p:dialog id="pBarDialog" header="Progressing..." widgetVar="dlg" modal="true" height="70" resizable="false" closable="false">  
    <h:outputText value="Please wait, we're generating your info..." />  
    <p:progressBar widgetVar="pbAjax" ajax="true" value="100" styleClass="animated">     </p:progressBar>  
 </p:dialog>

Итак, как я могу отобразить диалоговое окно, когда я нажимаю вкладку «Статистика»?


tabview primefaces jsf-2.2
person nosnhoj    schedule 20.11.2013    source источник

Ответы (3)


arrow_upward
1
arrow_downward

Вы можете сделать что-то вроде этого:

public void onTabChange(TabChangeEvent event) {
    TabView tv = (TabView) event.getComponent();
    int activeTabIndex = tv.getActiveIndex();
    System.out.println(activeTabIndex);
    if(activeTabIndex==1)//Stat tab clicked
    {                    
        //do something here...
    }
    if(activeTabIndex==2){
        RequestContext.getCurrentInstance().execute("PF('dlg').show()"); //For Primeface 4.0
        RequestContext.getCurrentInstance().execute("dlg.show()"); //Before Primeface 4.0
    }
}
person Joffrey Hernandez    schedule 20.11.2013
comment
Я не знаю, почему это не работает. Но моя проблема разрешилась с помощью решения Эмиля Камински. Тем не менее, большое спасибо! - person nosnhoj; 20.11.2013
comment
Я считаю, что это хорошее решение. Я буду использовать это решение, если смогу. Не знаю, делал ли я что-то не так. - person nosnhoj; 20.11.2013
comment
Какая у вас версия праймфейсов? - person Joffrey Hernandez; 20.11.2013
comment
Я использую Primefaces версии 4.0. - person nosnhoj; 20.11.2013
comment
Итак, используйте только RequestContext.getCurrentInstance().execute("PF('dlg').show()");, какой у вас activeTabIndex, когда вы выбираете вкладку статистики? у вас есть ошибка javascript? - person Joffrey Hernandez; 20.11.2013
comment
Он ничего не показывает, пока я использую RequestContext.getCurrentInstance().execute(PF('dlg').show()); или даже RequestContext.getCurrentInstance().execute(dlg.show()); - person nosnhoj; 20.11.2013
comment
Нет, ошибки javascript нет. когда я выбираю вкладку статистики, activeTabIndex равен 0, и я помещаю код в соответствующий раздел. вот так: public final void onTabChange(final TabChangeEvent event) { TabView tv = (TabView) event.getComponent(); int activeTabIndex = tv.getActiveIndex(); System.out.println(activeTabIndex); if(activeTabIndex==1) { RequestContext.getCurrentInstance().execute("PF('dlg').show()"); } } - person nosnhoj; 20.11.2013
comment
Я пробовал RequestContext.getCurrentInstance().execute("PF(pBarDialog).show()"), но все равно ничего не показывает. Орз - person nosnhoj; 20.11.2013
comment
удалить final из TabChangeEvent и метода. Теперь у вас должно быть значение activeTabIndex, отличное от 0? - person Joffrey Hernandez; 20.11.2013
comment
Извините, моя вина. Когда я выбираю вкладку статистики, activeTabIndex равен 1. (Я удалил final из TabChangeEvent) - person nosnhoj; 20.11.2013
comment
с RequestContext.getCurrentInstance().execute(PF('pBarDialog').show())? или RequestContext.getCurrentInstance().execute(PF('dlg').show())? - person Joffrey Hernandez; 20.11.2013
comment
Я пробовал оба, но они одинаковы. Ни сообщения об ошибке, ни диалогового окна. - person nosnhoj; 20.11.2013
comment
вы забыли 'и' между pBarDialog и его dlg, поэтому PF('dlg').show() - person Joffrey Hernandez; 20.11.2013
comment
Все еще не работает... public void onTabChange(TabChangeEvent event) { TabView tv = (TabView) event.getComponent(); int activeTabIndex = tv.getActiveIndex(); if(activeTabIndex==1) { RequestContext.getCurrentInstance().execute("PF('dlg').show()"); goToUrl("myStat.xhtml"); } } - person nosnhoj; 20.11.2013

arrow_upward
0
arrow_downward

Решением может быть использование атрибута visible в диалоговом окне:

<p:dialog id="pBarDialog" header="Progressing..." visible="#{myConsoleBean.showDialog}"
    modal="true" height="70" resizable="false" closable="false">

В вашем бине:

private boolean showDialog;

public void displayDialog() {
    showDialog = true;
}

public boolean getShowDialog() {
    return showDialog;
}

А потом

 if(activeTabIndex==1)//Stat tab clicked
            {                    
                myConsoleBean.displayDialog();
            }

Также убедитесь, что ваши компоненты ajax обновляют диалоговое окно.

person Emil Kaminski    schedule 20.11.2013
comment
Извините, я обнаружил, что диалоговое окно отображается, даже если я нажимаю на другие вкладки, я должен что-то сделать, чтобы это исправить? - person nosnhoj; 20.11.2013
comment
Извините, я не прочитал ваш вопрос полностью, я пропустил часть, где диалоговое окно должно отображаться только на определенных вкладках. Смотрите мой обновленный ответ - person Emil Kaminski; 20.11.2013
comment
Как это? public void onTabChange(TabChangeEvent event) { TabView tv = (TabView) event.getComponent(); int activeTabIndex = tv.getActiveIndex(); if(activeTabIndex==1) { displayDialog(); goToUrl("myStat.xhtml"); } } private boolean showDialog; public void displayDialog() { showDialog = true; } public boolean getShowDialog() { return showDialog; } - person nosnhoj; 21.11.2013
comment
Однако он ничего не показывает перед goToUrl(myStat.xhtml); сделано. Потому что, когда я нажимаю вкладку «Статистика», он просто обновляет showDialog, и метод возвращается после моего goToUrl(myStat.xhtml); функция сделана. Таким образом, диалоговое окно будет отображаться после того, как все будет сделано, а я хочу, чтобы диалоговое окно отображалось, когда goToUrl(myStat.xhtml); Бег. - person nosnhoj; 21.11.2013

arrow_upward
0
arrow_downward

Я думаю, что решил эту проблему. Я использовал p:remoteCommand после того, как увидел эту ветку.

И вот мои окончательные коды:

Страница:

            <p:tabView effect="fade" effectDuration="normal">
            <p:ajax event="tabChange" listener="#{myConsoleBean.onTabChange}" oncomplete="dlg.hide()" update=":rightForm"/>
            <p:tab title="My">

            </p:tab>
            <p:tab id="statTab" title="Stat">
                <p:remoteCommand actionListener="#{myConsoleBean.goToUrl('myStat.xhtml')}" update=":rightForm" name="showStat" global="true" onstart="dlg.show()" oncomplete="dlg.hide()"></p:remoteCommand>
            </p:tab>
        </p:tabView>

        <p:dialog id="pBarDialog" header="Progressing..." widgetVar="dlg" modal="true" height="70" resizable="false" closable="false">  
            <h:outputText value="Please wait, we are generating your info..." />  
            <p:progressBar widgetVar="pbAjax" ajax="true" value="100" styleClass="animated">  
            </p:progressBar>  
        </p:dialog>

Бин:

 public void onTabChange(TabChangeEvent event) {
            TabView tv = (TabView) event.getComponent();
            int activeTabIndex = tv.getActiveIndex();
            if(activeTabIndex==1)
            {
                RequestContext.getCurrentInstance().execute("showStat()");
            }
   }

Как бы то ни было, спасибо вам обоим, Ламку и Эмилю Камински. Я никогда не найду эту тему без вашей помощи, потому что я набираю ключевые слова из ваших ответов.

person nosnhoj    schedule 21.11.2013