In Richfaces, wizard can be created with <rich:togglePanel />, but the disadvantage of this solution is, the component tree would be quite large.
Because the togglePanel component needed to hold all components for all pages in <rich:togglePanelItem />
Which mean the server needs more memory in order to work well in this situation.
and this solution, applicable to Richfaces only.
In this post, I will show how to create a wizard application with dynamic include. Thus, the component tree only hold the required page. and this solution is applicable to all JSF implementation.
Steps:
1. Create the xhtml for wizard wrapper.
Highlighted codes are the important section for the dynamic include.
2. Create the xhtml for wizard pages.
It contains the content of the wizard. eg, wizardStep1.xhtml, wizardStep2.xhtml, and so on.
with a navigation link/button to navigate to the next wizard step.
Highlighted codes are the important section to navigate to next step.
3. Create the @SessionScoped wizardBean for navigation case.
3.1 create the url property for value binding.
3.2 if url is null, default to first page.
3.3 create the wizard navigation cases
In this step, it could be gotoWizard3(), gotoWizard4() and so on.
Because the togglePanel component needed to hold all components for all pages in <rich:togglePanelItem />
Which mean the server needs more memory in order to work well in this situation.
and this solution, applicable to Richfaces only.
In this post, I will show how to create a wizard application with dynamic include. Thus, the component tree only hold the required page. and this solution is applicable to all JSF implementation.
Steps:
1. Create the xhtml for wizard wrapper.
Highlighted codes are the important section for the dynamic include.
2. Create the xhtml for wizard pages.
It contains the content of the wizard. eg, wizardStep1.xhtml, wizardStep2.xhtml, and so on.
with a navigation link/button to navigate to the next wizard step.
Highlighted codes are the important section to navigate to next step.
3. Create the @SessionScoped wizardBean for navigation case.
3.1 create the url property for value binding.
3.2 if url is null, default to first page.
3.3 create the wizard navigation cases
In this step, it could be gotoWizard3(), gotoWizard4() and so on.
complete source for step 3:
Done!!
How to create layout with dynamic include is a similar example on using dynamic include
Dynamic include with richfaces popupPanel is another example on using dynamic include.
How to create layout with dynamic include is a similar example on using dynamic include
Dynamic include with richfaces popupPanel is another example on using dynamic include.
No comments:
Post a Comment