1 Reply Latest reply on Aug 5, 2010 7:42 AM by Ilya Shaikovsky

    How to switch the tab with reRender, rich:tabPanel id???

    Siva P Master

      Hi all,

       

      I have problem with tab rerender and switching to tab2. Main.jsp's <rich:tabPanel id is showing in blue color.In tab1.jsp 's command link how can i reRender Main jsp's tab panel id="tabs1".Below is my screen.As per logic i have to show when i click Next button as command link and it should show the Tab2.How it is possible.Any other option to do that scenario????

       

      TabProbem.JPG

       

      Main jsp:

       

       

      <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
      <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
      <%@ taglib prefix="c" uri="http://java.sun.com/jstl/core"%>
      <!-- RichFaces tag library declaration -->
      <%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
      <%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>
      <html>
      <head>
      <body >
      <h:form id="wallpaperForm">
      <a4j:region id="wallpaperRegion">
      <table width="1000" border="0" cellspacing="0" cellpadding="0">
        <tr>
      <td width="843" valign="top"><table width="840" cellpadding="0" cellspacing="0">
            <tr>
              <td><table width="835" height="50%" border="0" cellpadding="0" cellspacing="0">
                <tr>
                  <td width="95" height="25" bgcolor="#45aed8" style="background-repeat:no-repeat"><table width="830" border="0" cellspacing="0.1" cellpadding="0.1">
                    <tr>
                      <td width="66%"><span> Home &gt; New Postpaid</span></td>
                      <td width="12%"> </td>
                      <td width="15%">Your Serving Time:</td>
                      <td width="5%"><input name="textfield17" type="text" id="textfield2" value="00:00" size="8" disabled="disabled" /></td>
                      <td width="2%"> </td>
                    </tr>
                  </table></td>
                  </tr>
                <tr>
                  <td> </td>
      <td></td>
                  </tr>
                </table></td>
            </tr>
      </td>
        </tr>
        <tr>
        <td align="center">
        <rich:separator lineType="beveled" height="20" align="center"/>
        This is Dashboard page.
        </td>
        </tr>
        <tr>
        <td>
      <p>Here is an example of tab panel switched completely on client.</p>
          <rich:tabPanel switchType="server" styleClass="tabbertab" id="tabs1"binding="#{controllerBean.tabPanel}"
      selectedTab="#{controllerBean.selectedTab}">
              <rich:tab label="First" styleClass="myClass" id="listTab1" >
                  Here is tab #1
      <h:panelGrid id="tabselect1">
      <a4j:include id="pageinclude1"
      viewId="/home/TabPan1.jsp"/>
      </h:panelGrid>
              </rich:tab>
              <rich:tab label="Second" styleClass="myClass" id="listTab2">
                  Here is tab #2
      <h:panelGrid id="tabselect2">
      <a4j:include id="pageinclude2"
      viewId="/home/TabPan2.jsp"/>
      </h:panelGrid>
              </rich:tab>
              <rich:tab label="Third" styleClass="myClass">
                  Here is tab #3
              </rich:tab>
          </rich:tabPanel>
        </td>
        </tr>
        </table>
          </a4j:region>
      </h:form>
      </body>
      </html>
      TabPan1.jsp

      <<table width="1000" border="0" cellspacing="0" cellpadding="0">
        <tr>
      <td width="843" valign="top"><table width="840" cellpadding="0" cellspacing="0">
            <tr>
              <td><table width="835" height="50%" border="0" cellpadding="0" cellspacing="0">
                <tr>
                  <td width="95" height="25">
      <table width="830" border="0" cellspacing="0.1" cellpadding="0.1">
                    <tr>
                      <td width="100%">
      TabPanel1
      <a4j:commandLink id="link" value="Next>>" actionListener="#{controllerBean.listTab1Event}" immediate="true"
      reRender="tabs1">                     
                     </a4j:commandLink>
      </td>
                    </tr>
                  </table></td>
                  </tr>
                <tr>
                  <td> </td>
                  </tr>
                </table></td>
            </tr>
      </td>
        </tr>
        </table>
      My bean Class:
      public class ControllerBean {
      private static Log log = LogFactory.getLog(ControllerBean.class);
      private HtmlTabPanel tabPanel;
      private String selectedTab;
      /**
      *
      */
      public ControllerBean() {
      // TODO Auto-generated constructor stub
      }
      public HtmlTabPanel getTabPanel() {
      return tabPanel;
      }
      public void setTabPanel(HtmlTabPanel tabPanel) {
      this.tabPanel = tabPanel;
      }
      public String getSelectedTab() {
      return selectedTab;
      }
      public void setSelectedTab(String selectedTab) {
      this.selectedTab = selectedTab;
      }
      public void listTab1Event(ActionEvent event) {
      log.info("Entering into listTab1");
             tabPanel.setSelectedTab("listTab2");
             log.debug("getSelectedtab:"+tabPanel.getSelectedTab());
         }
      }