0 Replies Latest reply on Jan 4, 2008 7:27 PM by Andrey Chorniy

    How to prevent tab-switching in rich:tabPanel

    Andrey Chorniy Newbie

      I'm using rich:tabPanel to organise complex object editing
      [Seam 1.2.1GA/RichFaces 3.1.3 GA]

      On each tab I place set of forms responsible for editiong different group of properties.

      I need to perform form-submission and validation before switching to the next tab.
      I try to define ontableave javascript like ="getMyForm().submit()" which actually perform required form submission and validation (validation messages displayed on this tab)

      But how I can prevent tab-switching if validation fails ? Because if object state on the server side will be invalid (not corrctly filled) I will got a errors then I try to save it in db and in the end-of-the-end - it is correct to stay on the form which is filled with error, because later it is hard to redirect user to the "error" tab (and I may have more then one tbas with non-valid data).

      I don't see possible ways how I can implement that with rich:tabPanel event model - "Perform form submission and validation with preventing user to switch to another tab if validation fails (or any other server-side exception) occurs).
      I think I need some listener which can return boolean value to tabPanel component or throw "TabSwitchNotAllowed" exception at the server-side.

      I wan't to prevent switching from "tab1" if the server-side form validation failed.

      <rich:tabPanel id="campaignBuilderTabs" switchType="ajax" selectedTab="#{selectedTab.name}">
       <rich:tab label="Properties" id="tab1"
      ontableave="getElementbyId('myForm').submit();">
      <h:form id='myForm'>
      ....input fields...
      </h:form>
       </rich:tab>
       <rich:tab label="Workspace" id="tab2" >
       <ui:include src="/WEB-INF/incl/tab3.xhtml" />
       </rich:tab>
       <rich:tab label="Summary" id="tab3" >
       <ui:include src="/WEB-INF/incl/tab4.xhtml" />
       </rich:tab>
      </rich:tabPanel>