I've got a problem with the wizard component with primefaces1.0.0.
When I navigate to the right until the last tab and then come back with the previous button, the next button is not showing anymore. So when I come back in the first tab I have no navigation button at all.
It works fine in the showcase but nit in my environment.
I've got no Javascript error.
With firebug I can see that the answer is the following when come back to the first tab :
Code: Select all
<wizardresponse><wizardtab><success>true</success><content><![CDATA[
<script type="text/javascript">PrimeFaces.onContentReady('j_id4:wizard:j_id6', function() {
j_id4_wizard_j_id6_widget = new PrimeFaces.widget.Panel('j_id4:wizard:j_id6', {});});</script>
<div id="j_id4:wizard:j_id6" class="pf-panel">
<div id="j_id4:wizard:j_id6_hd" class="pf-panel-hd">Personal Details</div>
<div id="j_id4:wizard:j_id6_bd" class="pf-panel-bd">
<table class="grid">
<tbody>
<tr>
<td class="label">Param1 : *</td>
<td class=" value"><input type="text" name="j_id4:wizard:j_id10" value="1" /></td>
</tr>
</tbody>
</table>
</div></div>]]></content></wizardtab>
<state><![CDATA[<input type="hidden" name="javax.faces.ViewState" id="javax.faces.ViewState" value="j_id1:j_id12" />]]>
</state></wizardresponse>
Code: Select all
<html xmlns:a="http://www.andromda.org/cartridges/jsf" xmlns="http://www.w3.org/1999/xhtml"><head>
<title>Formulaire 1</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link href="/testjsf/primefaces_resource/1.0.0/primefaces/wizard/assets/wizard.css" type="text/css" rel="stylesheet">
<script src="/testjsf/primefaces_resource/1.0.0/yui/utilities/utilities.js" type="text/javascript"></script>
<script src="/testjsf/primefaces_resource/1.0.0/jquery/jquery.js" type="text/javascript"></script>
<script src="/testjsf/primefaces_resource/1.0.0/jquery/plugins/tabswitch/tabswitch.js" type="text/javascript"></script>
<script src="/testjsf/primefaces_resource/1.0.0/primefaces/core/core.js" type="text/javascript"></script>
<script src="/testjsf/primefaces_resource/1.0.0/primefaces/wizard/wizard.js" type="text/javascript"></script>
<link href="/testjsf/primefaces_resource/1.0.0/primefaces/panel/panel.css" type="text/css" rel="stylesheet">
<script src="/testjsf/primefaces_resource/1.0.0/primefaces/panel/panel.js" type="text/javascript"></script>
<link href="/testjsf/primefaces_resource/1.0.0/jquery/plugins/gritter/assets/gritter.css" type="text/css" rel="stylesheet">
<script src="/testjsf/primefaces_resource/1.0.0/jquery/plugins/gritter/jquery.gritter.js" type="text/javascript"></script>
<script src="/testjsf/primefaces_resource/1.0.0/primefaces/ajaxstatus/ajaxstatus.js" type="text/javascript"></script>
</head><body class="yui-skin-sam">
<form enctype="application/x-www-form-urlencoded" action="/testjsf/test/page1-formulaire1.jsf" method="post" name="j_id4" id="j_id4">
<input type="hidden" value="j_id4" name="j_id4">
<script type="text/javascript">PrimeFaces.onContentReady('j_id4:wizard', function() {
wizard = new PrimeFaces.widget.Wizard('j_id4:wizard',{type:'toggle',actionURL:'/testjsf/test/page1-formulaire1.jsf',size:3,formId:'j_id4',viewportClass:'pf-wizard-viewport',speed:175,width:600,height:250});
});
</script>
<div style="height: 250px; width: 600px;" id="j_id4:wizard"><div class="pf-wizard-nav"><div onclick="wizard.previous();" style="display: none;" class="pf-wizard-prev" id="j_id4:wizard_prev"></div> <!-- HERE you can see display : none !!! -->
<div class="pf-wizard-next" onclick="wizard.next();" id="j_id4:wizard_next" style="display: none;"></div> <!-- HERE you can see display : none !!! -->
</div><div id="ViewPortj_id4_wizard" style="width: 600px; height: 250px; display: block; overflow: hidden; position: relative;" class="pf-wizard-viewport"><div id="WideDivj_id4_wizard" style="position: relative; width: 600px; height: 250px;"><div class="pf-wizard-tab" id="j_id4:wizard_tab0" style="width: 600px; height: 250px; position: absolute; left: 0px; top: 0px; opacity: 1;"><div class="pf-panel" id="j_id4:wizard:j_id6"><div class="pf-panel-hd" id="j_id4:wizard:j_id6_hd">Personal Details</div><div class="pf-panel-bd" id="j_id4:wizard:j_id6_bd"><table class="grid">
<tbody>
<tr>
<td class="label">Param1 : *</td>
<td class=" value"><input type="text" value="1" name="j_id4:wizard:j_id10"></td>
</tr>
</tbody>
</table>
</div></div></div><div class="pf-wizard-tab" id="j_id4:wizard_tab1" style="width: 600px; height: 250px; position: absolute; left: -999px; top: 0px; opacity: 0;"><div class="pf-panel" id="j_id4:wizard:j_id12"><div class="pf-panel-hd" id="j_id4:wizard:j_id12_hd">Adress Details</div><div class="pf-panel-bd" id="j_id4:wizard:j_id12_bd"><table>
<tbody>
<tr>
<td class="label">PrenomNom : </td>
<td class=" value"><input type="text" value="12" name="j_id4:wizard:j_id16"></td>
</tr>
</tbody>
</table>
</div></div></div><div class="pf-wizard-tab" id="j_id4:wizard_tab2" style="width: 600px; height: 250px; position: absolute; left: -999px; top: 0px; opacity: 0;"><div class="pf-panel" id="j_id4:wizard:j_id18"><div class="pf-panel-hd" id="j_id4:wizard:j_id18_hd">Confirmation</div><div class="pf-panel-bd" id="j_id4:wizard:j_id18_bd"><span id="j_id4:wizard:growl"></span><table id="j_id4:wizard:confirmation">
<tbody>
<tr>
<td>Param1 : </td>
<td><span class="outputLabel">1</span></td>
</tr>
<tr>
<td>PrenomNom : </td>
<td><span class="outputLabel">12</span></td>
</tr>
</tbody>
</table>
<span id="j_id4:wizard:j_id23"><input type="submit" onclick="PrimeFaces.ajax.AjaxRequest('/testjsf/test/page1-formulaire1.jsf',{formId:'j_id4',global:true},{'j_id4:wizard:j_id23_submit':'j_id4:wizard:j_id23_submit','primefacesPartialUpdate':'j_id4:wizard:growl'});return false;" value="Submit" name="j_id4:wizard:j_id23_submit" id="j_id4:wizard:j_id23_submit"></span></div></div></div></div></div></div><script type="text/javascript">PrimeFaces.onContentReady('j_id4:j_id24', function() {
j_id4_j_id24_widget = new PrimeFaces.widget.AjaxStatus('j_id4:j_id24');
j_id4_j_id24_widget.bindFacet('ajaxStart', 'j_id4:j_id24_start');
j_id4_j_id24_widget.bindFacet('ajaxComplete', 'j_id4:j_id24_complete');
});</script><div id="j_id4:j_id24"><div style="display: none;" id="j_id4:j_id24_start"><img src="../design/ajaxloading.gif"></div><div style="display: block;" id="j_id4:j_id24_complete"></div></div><input type="hidden" value="j_id1:j_id16" id="javax.faces.ViewState" name="javax.faces.ViewState">
</form>
</body></html>
Code: Select all
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html 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:c="http://java.sun.com/jstl/core"
xmlns:a="http://www.andromda.org/cartridges/jsf"
xmlns:p="http://primefaces.prime.com.tr/ui">
<f:view contentType="text/html">
<head>
<title>Formulaire 1</title>
<meta content='text/html; charset=UTF-8' http-equiv="Content-Type"/>
<p:resources />
</head>
<body>
<h:form>
<p:wizard id="wizard" widgetVar="wizard" height="250" width="600" speed="175" effect="toggle">
<p:tab>
<p:panel header="Personal Details">
<h:messages errorClass="error"/>
<h:panelGrid columns="2" columnClasses="label, value" styleClass="grid">
<h:outputText value="Param1 : *" />
<h:inputText value="#{controllerTest.param1}" required="true" label="Firstname"/>
</h:panelGrid>
</p:panel>
</p:tab>
<p:tab>
<p:panel header="Adress Details">
<h:messages errorClass="error"/>
<h:panelGrid columns="2" columnClasses="label, value">
<h:outputText value="PrenomNom : " />
<h:inputText value="#{controllerTest.prenomNom}" />
</h:panelGrid>
</p:panel>
</p:tab>
<p:tab>
<p:panel header="Confirmation">
<p:growl id="growl" sticky="true" showDetail="true"/>
<h:panelGrid id="confirmation" columns="2">
<h:outputText value="Param1 : " />
<h:outputText value="#{controllerTest.param1}" styleClass="outputLabel"/>
<h:outputText value="PrenomNom : " />
<h:outputText value="#{controllerTest.prenomNom}" styleClass="outputLabel"/>
</h:panelGrid>
<p:commandButton value="Submit" actionListener="#{controllerTest.operation3}" update="growl" />
</p:panel>
</p:tab>
</p:wizard>
<p:ajaxStatus>
<f:facet name="start">
<h:graphicImage value="../design/ajaxloading.gif" />
</f:facet>
<f:facet name="complete">
<h:outputText value="" />
</f:facet>
</p:ajaxStatus>
</h:form>
</body>
</f:view>
</html>
Did someone experiment the same error ?
Thank's for your answer.