0
    <p:tabView widgetVar="addSystemWizard" style="width:980px;height:400px;" dynamic="true"  activeIndex="#{testBean.messagesTab.activeIndex}" >  

          <p:ajax event="tabChange" listener="#{testBean.onTabChange}" update=":tabview:sysMsg"/>  

            <p:tab id="generalInfo" title="1. General Information">  `enter code here`



private TabView messagesTab;

    public TabView getMessagesTab () {
        if(messagesTab==null){
            messagesTab= new TabView();
        }
        return messagesTab;
    }

    public void setMessagesTab(TabView messagesTab ) {
        this.messagesTab = messagesTab;
    }


    public void onTabChange(TabChangeEvent event){
        if(test.getName()==null || test.getName().equals("")){

            FacesMessage msg = new FacesMessage(FacesMessage.SEVERITY_ERROR, event.getTab().getId() ,"please enter all required fields");  

            FacesContext.getCurrentInstance().addMessage(null, msg);  
            int idx=0;
            messagesTab= (TabView) event.getComponent();
            messagesTab.setActiveIndex(idx);
        }

    }

私はタブビューでタブ変更イベントを呼び出しています。私のページにname属性があります。その属性が空白またはnullの場合、同じタブに留まる必要があります。それを行うコードですが、機能していません!

4

1 に答える 1

0

これを実現するためにaとjavascriptを使用する方法を説明するこのブログ投稿を見つけました。p:remoteCommand

上記の質問に対するさまざまなアプローチ(p:ajax event = "tabChange"など)を試して、クリーンでうまく機能するソリューションを思いつきました。以下のコードは、PrimeFacesTabViewを「ウィザードモード」に切り替えます。つまり、ユーザーがタブを切り替えようとしているときに同じタブに留まり、現在のタブ内で検証エラーが発生します。主なアイデアは、タブの切り替えに関する遅延決定にp:remoteCommandを使用することです。検証エラーが存在しなかった場合、切り替えはTabViewウィジェットのメソッド選択によって行われます。

XHTML:

<p:tabView ... widgetVar="tv_widget" styleClass="tv_selector">
    ...
</p:tabView>

<p:remoteCommand name="tv_remoteCommand" process="@(.tv_selector)" update="@(.tv_selector)" global="false"
        oncomplete="handleTabChangeTV(xhr, status, args, tv_widget)"/>

<h:panelGroup id="tv_script" styleClass="tv_selector">
    <script type="text/javascript">
          $(function(){
              bindOnClickTV(tv_remoteCommand, tv_widget);
          });
    </script>
</h:panelGroup>

Javascript:

function bindOnClickTV(rc, widget) {
    // unbind PrimeFaces click handler and bind our own
    widget.jq.find('.ui-tabs-nav > li').unbind('click.tabview').
        off('click.custom-tabview').on('click.custom-tabview', function (e) {
            var element = $(this);

            if ($(e.target).is(':not(.ui-icon-close)')) {
                var index = element.index();

                if (!element.hasClass('ui-state-disabled') && index != widget.cfg.selected) {
                    // buffer clicked tab
                    widget.clickedTab = element.index();

                    // call remote command
                    rc();
                }
            }

            e.preventDefault();
        });
}

function handleTabChangeTV(xhr, status, args, widget) {
    if (!args.validationFailed) {
        widget.select(widget.clickedTab);
    }
}
于 2013-02-12T15:01:31.393 に答える