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

    Tab panel page navigation problem.

    sivaprasad9394

      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.
          sam-user

          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.
            sivaprasad9394

            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.
              sam-user

              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.
                sivaprasad9394

                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.
                  sivaprasad9394

                  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

                    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