Rich:modalpanel Wizard behaviour doesn't work

Question

i'm having a problem with my wizard-like behavior in rich:modal panel. I've read the tutorials and this http://maxkatz.sys-con.com/node/1428854/mobile and this http://www.mkyong.com/jsf2/jsf-form-action-navigation-rule-example/ . But non of them were of any help. My code is as follows:

faces-config:

    <!-- WizardProject -->
    <navigation-rule>
    <from-view-id>/widgets/wizard/ProjectStep.xhtml</from-view-id>
    <navigation-case>
        <from-action>#{projectWizard.goNext}</from-action>
        <from-outcome>SUCCESS</from-outcome>
        <to-view-id>/widgets/wizard/InfoStep.xhtml</to-view-id>
    </navigation-case>
    <navigation-case>
        <from-action>#{projectWizard.goNext}</from-action>
        <from-outcome>FAIL</from-outcome>
        <to-view-id>/widgets/wizard/InfoStep.xhtml</to-view-id>
    </navigation-case>
</navigation-rule>

my Richpanel:

<?xml version="1.0" encoding="UTF-8"?>

<ui:composition xmlns="http://www.w3.org/1999/xhtml"
  xmlns:f="http://java.sun.com/jsf/core"
  xmlns:h="http://java.sun.com/jsf/html"
  xmlns:c="http://java.sun.com/jstl/core"
  xmlns:ui="http://java.sun.com/jsf/facelets"
  xmlns:a4j="http://richfaces.org/a4j"
  xmlns:rich="http://richfaces.org/rich">

<!-- 
    Parameters:
        id - modal dialog id
        bean 
        src - firstWizardPage
 -->

 <rich:modalPanel id="#{id}" width="750" resizeable="false" autosized="true">

      <f:facet name="header">
        <h:panelGroup>
                <h:outputText  value="Wizard"/>
        </h:panelGroup>
      </f:facet>
      <h:form>
        <h:panelGroup id="test">
            <a4j:include id="wizardPage" viewId="#{src}"/>
        </h:panelGroup>
      </h:form>
    </rich:modalPanel>
</ui:composition>

The modal panel gets the parametrs correctly. The fist page openes up and the bean is called afterwards.

Here's the first page - ProjectStep.xhtml

<h:panelGroup xmlns="http://www.w3.org/1999/xhtml" 
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:h="http://java.sun.com/jsf/html" 
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:a4j="http://richfaces.org/a4j" 
    xmlns:rich="http://richfaces.org/rich"
    xmlns:c="http://java.sun.com/jstl/core">


        <h:outputText value="I've opened up #{bean}" />
        <h:inputText value=" " />
        <div class="actionButtons">
        <div class="actionCancelButtons">
          <a4j:commandButton id="btnNext" 
                             value="Next" 
                             action="#{bean.goNext()}"
                             style="display:#{bean.isCanGoNext() ? '' : 'none'}"
                             reRender="test"/>

            <a4j:region>
            <a4j:commandButton  onclick="#{rich:component(id)}.hide()" 
                                value="Cancel" 
                                style="display:#{bean.isCanCancel() ? '' : 'none'}"/>
            </a4j:region>
        </div>
        </div>




</h:panelGroup>

I've tried to use ui:composition instead of h:panelGroup. It didn't work. Thee second page is imlemented in the same way.

When i'm clicking Next my bean returns SUCCESS message, but the page doesn't get changed.

Please, doe anyone has an idea what's wrong?

Answer 1

Add the <redirect/> attribute to your faces_config.xml and probably try on the ajaxRendered="true" on your <a4j:include/> . Be absolutely sure your navigation cases are being invoked. Your faces_config should look like

 <navigation-rule>
    <from-view-id>/widgets/wizard/ProjectStep.xhtml</from-view-id>
    <navigation-case>
        <from-action>#{projectWizard.goNext}</from-action>
        <from-outcome>SUCCESS</from-outcome>
        <to-view-id>/widgets/wizard/InfoStep.xhtml</to-view-id>
        <redirect/>
    </navigation-case>
    <navigation-case>
        <from-action>#{projectWizard.goNext}</from-action>
        <from-outcome>FAIL</from-outcome>
        <to-view-id>/widgets/wizard/InfoStep.xhtml</to-view-id>
        <redirect/>
    </navigation-case>
</navigation-rule>