6 Replies Latest reply on Oct 20, 2010 4:48 AM by Ilya Shaikovsky

    Tab panel page navigation problem.

    Siva P Master

      Hi all,

       

      How to navigate to the next page??? this is my below code.....

       

      jsp:

       

      <%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
      <%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
      <%@ taglib prefix="rich" uri="http://richfaces.org/rich" %>
      <%@ taglib prefix="a4j" uri="http://richfaces.org/a4j"%>
           
      <html>
      <head>
      <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
      <title>Existing Customer-PostPaid</title>
      </head>
      <body>
      <f:subview id="postpaidCustomerView">
      <h:form id="postpaidCustomerForm">
      <h:panelGrid id="tabpanelgrid">
      <!--Main table starts here -->
      <table width="818" border="0" cellspacing="0" cellpadding="0">
        <tr>   
          <td width="818" valign="top">
          <table class="font" width="100%" cellpadding="1" cellspacing="1" border="0">
            <tr>
              <td>
              <table width="100%" height="50%" border="0" cellpadding="0" cellspacing="0">
                  <tr>
                    <td width="95" height="25" bgcolor="#45aed8" style="background-repeat:no-repeat">
                    <table width="819" border="0" cellspacing="0.1" cellpadding="0.1">
                      <tr>
                        <td width="66%"><span class="font_white"> Home &gt; Existing Customer &gt; Postpaid</span></td>
                        <td width="12%"> </td>
                        <td width="15%"> </td>
                        <td width="5%"> </td>
                        <td width="2%"> </td>
                      </tr>
                    </table></td>
                  </tr>
                  <tr>
                    <td> </td>
                  </tr>
                  <tr>
                    <td>
                    <table width="100%" border="0">
                      <tr align="center" class="header_table_inside">
                        <td width="123"><a href ="#General">General Info</a></td>
                        <td width="126"><a href ="#Billing">Billing Address</a></td>
                        <td width="131"><a href ="#Account">Account Details</a></td>
                        <td width="110"><a href ="#Services">Services</a></td>
                        <td width="98"><a href ="#Subscription">Subscription</a></td> 
                        <td width="110"><a href ="#One">1 + 5 </a></td>
                        <td width="102"><a href ="#Arbor">Arbor Notes</a></td>
                      </tr>
                    </table>
                   </td>
                  </tr>
              </table></td>
            </tr>
           
           <tr height="19">
              <td colspan="8" height="19"><span class="title_header_black"> 
              <a name ="General" class="title_header_black"></a>General Information</span></td>
            </tr>
            <tr>
              <td height="2" bgcolor="#45aed8"></td>
            </tr>
            <tr>
              <td>      
                  <!--tab General Information starts here -->
                 
               
      <rich:tabPanel  switchType="client" id="tp1" styleClass="tabbertab">
      <rich:tab id="GeneralInfo" label="General Info" name="General Info" styleClass="myClass">
      <a4j:include id="generalInformationPage" viewId="/existingcustomer/postpaid/genaralinformation/generalinfo/generalInformation.jsp"/>
      </rich:tab>
      <rich:tab  id="ExternalID" label="External ID" name="External ID" styleClass="myClass">
      <a4j:include id="externalIDPage"  viewId="/existingcustomer/postpaid/genaralinformation/externalID/externalID.jsp"/>
      </rich:tab>
      </rich:tabPanel>
      <!--tab General Information ends here -->  
              </td>
            </tr>
           <!-- Here we have to add -->
          </table></td>
        </tr>
      </table>
      </h:panelGrid>
      <h:panelGrid columns="1">
      <a4j:commandButton value="Next>>" limitToList="true"  immediate="true" reRender="postpaidCustomerForm,postpaidCustomerView,tabpanelgrid,tp1"
                          action="#{existingCustomerBean.submitPostpaidDetailsNext}"
                          onclick="alert('Hello!')"/>
      </h:panelGrid>
      </h:form>
      </f:subview>
      </body>
      </html>

      <%@taglib prefix="f" uri="http://java.sun.com/jsf/core"%>

      <%@taglib prefix="h" uri="http://java.sun.com/jsf/html"%>

      <%@ taglib prefix="rich" uri="http://richfaces.org/rich" %>

      <%@ taglib prefix="a4j" uri="http://richfaces.org/a4j"%>

       

       

      <html>

      <head>

      <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

      <title>Existing</title>

      </head>

       

      <body>

      <f:subview id="postpaidCustomerView">

      <h:form id="postpaidCustomerForm">

      <h:panelGrid id="tabpanelgrid">

      <!--Main table starts here -->

       

       

      <table width="818" border="0" cellspacing="0" cellpadding="0">

        <tr>   

          <td width="818" valign="top">

          <table class="font" width="100%" cellpadding="1" cellspacing="1" border="0">

            <tr>

              <td>

              <table width="100%" height="50%" border="0" cellpadding="0" cellspacing="0">

                  <tr>

                    <td width="95" height="25" bgcolor="#45aed8" style="background-repeat:no-repeat">

                    <table width="819" border="0" cellspacing="0.1" cellpadding="0.1">

                      <tr>

                        <td width="66%"><span class="font_white"> Home &gt; Existing Customer &gt; Postpaid</span></td>

                        <td width="12%"> </td>

                        <td width="15%"> </td>

                        <td width="5%"> </td>

                        <td width="2%"> </td>

                      </tr>

                    </table></td>

                  </tr>

                  <tr>

                    <td> </td>

                  </tr>

                  <tr>

                    <td>

                    <table width="100%" border="0">

                      <tr align="center" class="header_table_inside">

                        <td width="123"><a href ="#General">General Info</a></td>

                        <td width="126"><a href ="#Billing">Billing Address</a></td>

                        <td width="131"><a href ="#Account">Account Details</a></td>

                        <td width="110"><a href ="#Services">Services</a></td>

                        <td width="98"><a href ="#Subscription">Subscription</a></td> 

                        <td width="110"><a href ="#One">1 + 5 </a></td>

                        <td width="102"><a href ="#Arbor">Arbor Notes</a></td>

                      </tr>

                    </table>

                   </td>

                  </tr>

              </table></td>

            </tr>

       

       

           <tr height="19">

              <td colspan="8" height="19"><span class="title_header_black"> 

              <a name ="General" class="title_header_black"></a>General Information</span></td>

            </tr>

            <tr>

              <td height="2" bgcolor="#45aed8"></td>

            </tr>

            <tr>

              <td>      

                  <!--tab General Information starts here -->

       

                

      <rich:tabPanel  switchType="client" id="tp1" styleClass="tabbertab">

       

      <rich:tab id="GeneralInfo" label="General Info" name="General Info" styleClass="myClass">

      <a4j:include id="generalInformationPage" viewId="/existingcustomer/postpaid/genaralinformation/generalinfo/generalInformation.jsp"/>

      </rich:tab>

       

      <rich:tab  id="ExternalID" label="External ID" name="External ID" styleClass="myClass">

      <a4j:include id="externalIDPage"  viewId="/existingcustomer/postpaid/genaralinformation/externalID/externalID.jsp"/>

      </rich:tab>

       

      </rich:tabPanel>

       

      <!--tab General Information ends here -->  

       

              </td>

            </tr>

           <!-- Here we have to add -->

          </table></td>

        </tr>

      </table>

       

      </h:panelGrid>

       

      <h:panelGrid columns="1">

      <a4j:commandButton value="Next>>" limitToList="true"  immediate="true" reRender="postpaidCustomerForm,postpaidCustomerView,tabpanelgrid,tp1"

                action="#{existingCustomerBean.submitPostpaidDetailsNext}"

                onclick="alert('Hello!')"/>

      </h:panelGrid>

      </h:form>

      </f:subview>

      </body>

      </html>

       

       

      faces-config.xml

       

       

      <navigation-rule>

        <from-view-id>/existingcustomer/postpaid/postpaidMainPage.jsp</from-view-id>

        <navigation-case>

         <from-action>#{existingCustomerBean.submitPostpaidDetailsNext}</from-action>

         <from-outcome>success</from-outcome>

         <to-view-id>/existingcustomer/postpaid/approval_page.jsp</to-view-id>

         

        </navigation-case>

      </navigation-rule>

       

      it is not navigating to next page.....How to solve this problem?

        • 1. Re: Tab panel page navigation problem.
          Some Kid Newbie

          A couple of points:

          1. Technically speaking these are xhtml pages, not jsp
          2. Make sure your submitPostpaidDetailsNext function returns "success"
          • 2. Re: Tab panel page navigation problem.
            Siva P Master

            HI Sam ,

             

            Thank you for your reply.

             

            Below is my method.It is calling and printing in log also,but it is not navigating.....

             

            public String submitPostpaidDetailsNext()

            {

            String action = null;

            log.debug("Entering into submitPostpaidDetailsNext...");

            System.out.println("Entering into submitPostpaidDetailsNext...");

            action = "success";

            return action;

            }

             

            public String submitPostpaidDetailsNext()
            {
            String action = null;
            log.debug("Entering into submitPostpaidDetailsNext...");
            System.out.println("Entering into submitPostpaidDetailsNext...");
            action = "success";
            return action;
            }

            • 3. Re: Tab panel page navigation problem.
              Some Kid Newbie

              seems OK.

              Still not sure about this jsp extension, but maybe that's OK too.

              Some observations:

              In the following line

              <a4j:commandButton  value="Next>>" limitToList="true"  immediate="true"  reRender="postpaidCustomerForm,postpaidCustomerView,tabpanelgrid,tp1"

                        action="#{existingCustomerBean.submitPostpaidDetailsNext}"

                        onclick="alert('Hello!')"/>

              you have reRender, onclick and action attributes defined.

              What's the point of reRender if you want to navigate away from this page as a result of the action. I guess the onclick event is simply to make sure you've clicked the button.

              I personally define my navigation in xx.page.xhtml files. Have you tried this?

              • 4. Re: Tab panel page navigation problem.
                Siva P Master

                Hi Sam,

                 

                Thanks for your reply.Yes u are correct.

                Even i tried like this ,when i removed the a4j:include and submitted the page using Next>> button that time i am able to see the next page.....

                 

                <rich:tabPanel  switchType="client" id="tp1" styleClass="tabbertab">

                 

                <rich:tab id="GeneralInfo" label="General Info" name="General Info" styleClass="myClass">

                <a4j:include id="generalInformationPage" viewId="/existingcustomer/postpaid/genaralinformation/generalinfo/generalInformation.jsp"/>

                </rich:tab>

                 

                <rich:tab  id="ExternalID" label="External ID" name="External ID" styleClass="myClass">

                <a4j:include id="externalIDPage"  viewId="/existingcustomer/postpaid/genaralinformation/externalID/externalID.jsp"/>

                </rich:tab>

                 

                </rich:tabPanel>

                 

                Why when i remove the a4j:include  page it is submitting now.???what could be the problem and now my command button is

                 

                <h:commandButton value="Next>>" immediate="true"
                                    action="#{existingCustomerBean.submitPostpaidDetailsNext}"
                                    onclick="alert('Hello!')"/>

                <h:commandButton value="Next>>" immediate="true"

                          action="#{existingCustomerBean.submitPostpaidDetailsNext}"

                          onclick="alert('Hello!')"/>

                 

                • 5. Re: Tab panel page navigation problem.
                  Siva P Master

                  HI all,

                   

                  How it is possible,commandlink is submiting the page and command button or ajax command button and link is not submitting the page??

                   

                  Why it behaves like this??

                   

                  <h:commandLink id="next" action="#{existingCustomerBean.submitPostpaidDetailsNext}">
                    <h:graphicImage alt="Next" title="Next" id="btnNextID" value="../_assets/image/btnNext.png"/>
                  </h:commandLink>
                  <h:commandButton id="nextbtn" action="#{existingCustomerBean.submitPostpaidDetailsNext}" image="../_assets/image/btnNext.png"
                     immediate="true"/>

                  <h:commandLink id="next" action="#{existingCustomerBean.submitPostpaidDetailsNext}">

                     <h:graphicImage alt="Next" title="Next" id="btnNextID" value="../_assets/image/btnNext.png"/>

                  </h:commandLink>


                  <h:commandButton id="nextbtn" action="#{existingCustomerBean.submitPostpaidDetailsNext}" image="../_assets/image/btnNext.png"

                      immediate="true"/>

                  • 6. Re: Tab panel page navigation problem.
                    Ilya Shaikovsky Master

                    ajax controls should update the same page via ajax by design. And h:command should perform navigation.

                    The only possible way to make navigation from a4j:command to function propertly - to add redirect flag to navigation case.

                    http://community.jboss.org/wiki/CommonAjaxRequestsProblems#navigation