5 Replies Latest reply on Jun 17, 2008 3:27 AM by darmstadter

    selectOneMenu and ModalPanel

    ninat
    ninat Apr 20, 2008 10:46 AM

      Hi everyone, i just wanna know if it's possible to use selectOneMenu inside the ModalPanel when this is working like a wizard, because when I hit the button to submit the form nothing happens

      So, I wanna if that is possible or it's just that I'm doing something wrong
      by the way i'm using richFaces 3.1.0

      Thanks in advanced...

      • 2106 Views
      • Tags:
        • 1. Re: selectOneMenu and ModalPanel
          ilya_shaikovsky
          ilya_shaikovsky Apr 21, 2008 10:30 AM (in response to ninat)

          at first current releases are:
          rich faces 3.1.4 (supports JSF 1.1 and higher)
          rich faces 3.2.0 (supports JSF 1.2 only)

          Also please show your page code.. Not sure that I understand you right.

            • Actions
          • 2. Re: selectOneMenu and ModalPanel
            sugi_chn
            sugi_chn Apr 29, 2008 8:59 AM (in response to ninat)

            nina... hav you implemented ? Is it working fine???

            Kindly share the code if possible..



            Thanks in advance
            sugi

              • Actions
            • 3. Re: selectOneMenu and ModalPanel
              darmstadter Jun 16, 2008 10:48 AM (in response to ninat)

              Hello ilya_shaikovsky,

              i have implemented a wizard with ModalPanel. In each step there is a selectOnemenu. But the wizard is crashed by setter-method with null value.
              For example: selecteOneMenu_1 with selectedItem_item1 in the first step1, selecteOneMenu_2 with selectedItem_item2 in the second step2, selecteOneMenu_3 with selectedItem_item3 in the third setp3. If from step1 to step2, the setter method of the item2 works fine, if go back setter method works fine too. If step1 to step2 and further to step3, go back from step3 to step2 setter method of the item3 works fine, aber from step2 go back to step1, the setter method of item3 is also called. But the setter method with null, and crash the wizard. if you nend the code, i will show the code late.


              thanks in advanced also.

                • Actions
              • 4. Re: selectOneMenu and ModalPanel
                ilya_shaikovsky
                ilya_shaikovsky Jun 16, 2008 11:16 AM (in response to ninat)

                please post the snippet.

                  • Actions
                • 5. Re: selectOneMenu and ModalPanel
                  darmstadter Jun 17, 2008 3:27 AM (in response to ninat)

                  step 1 (2 select items, first to step 2.1, second to 2.2)

                  <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:rich="http://richfaces.org/rich"
 xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
 xmlns:ui="http://java.sun.com/jsf/facelets"
 xmlns:dim="http://dimetis.de/jsf">
 <rich:panel styleClass="backgroundNet">
 <a4j:outputPanel id="createTaskType">
 <h:panelGrid style="margin-left:60px; margin-top:10px;">
 <h:selectOneMenu style="width : 360px;" value="#{createTaskDialogBean.taskType}">
 <f:selectItems value="#{createTaskDialogBean.taskTypes}" />
 <a4j:support event="onchange"/>
 </h:selectOneMenu>
 <rich:separator height="1px" style="margin-top:7px;"/>
 <rich:spacer height="190"></rich:spacer>
 </h:panelGrid>
 </a4j:outputPanel>
 </rich:panel>

 <h:panelGrid columns="4" style="margin-top:8px;vertical-align:bottom">
 <rich:spacer width="80px" />
 <rich:spacer width="110px" />

 <a4j:commandButton action="#{createTaskDialogBean.refreshBean}" reRender="createTaskType"
 onclick="Richfaces.hideModalPanel('taskWizard');"
 value="Cancel" style="float:right; width:110px; height:30px;"/>
 <a4j:commandButton value="Next >>" style="float:right; width : 110px; height:30px;"
 action="#{createTaskDialogBean.getTaskType}" />

 </h:panelGrid>
</ui:composition>


                  setp 2.1 ( 4 select items in selectOneMenu, to 3.1, 3.2, 3.3, 3.4) 
                  <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:rich="http://richfaces.org/rich"
 xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
 xmlns:ui="http://java.sun.com/jsf/facelets"
 xmlns:dim="http://dimetis.de/jsf">

 <a4j:jsFunction name="backAction" action="#{createTaskDialogBean.backAction}"
 reRender="createTaskType">
 <a4j:actionparam name="playout" assignTo="#{createTaskDialogBean.taskType}"/>
 </a4j:jsFunction>

 <rich:panel styleClass="backgroundNet">

 <h:panelGrid columns="3" style="margin-left:60px; margin-top:10px;">
 <h:outputText value="Playout Type:"/>
 <rich:spacer width="30"/>
 <h:selectOneMenu style="width: 255px;" value="#{createTaskDialogBean.playoutType}">
 <f:selectItems value="#{createTaskDialogBean.playoutTypes}"/>
 <a4j:support event="onchange" ajaxSingle="true"/>
 </h:selectOneMenu>
 </h:panelGrid>
 <rich:separator height="1px" width="360px" style="margin-top:7px; margin-left:60px;"/>
 <rich:spacer height="200"></rich:spacer>

 </rich:panel>

 <h:panelGrid columns="4" style="margin-top:8px;vertical-align:bottom">
 <rich:spacer width="80"></rich:spacer>
 <a4j:commandButton value="<< Previous" style="float:left;width: 110px; height:30px;"
 action="previous"/>

 <a4j:commandButton style="float:right;width: 110px; height:30px;"
 onclick="refresh();Richfaces.hideModalPanel('taskWizard');" value="Cancel">
 <a4j:jsFunction name="refresh" action="#{createTaskDialogBean.refreshBean}"
 oncomplete="resetMask();"/>
 <a4j:jsFunction name="resetMask" action="reset" ajaxSingle="true"/>
 </a4j:commandButton>
 <a4j:commandButton value="Next >>" style="float:right;width: 110px; height:30px;"
 action="#{createTaskDialogBean.getPlayoutType}" immediate="true" />
 </h:panelGrid>
 </ui:composition>


                  setp 3.1 (i post only step 3.1, parallel 3.2, 3.3, 3.4, which is depended by the selectOneMenu in step 2) 
                  <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:rich="http://richfaces.org/rich"
 xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
 xmlns:ui="http://java.sun.com/jsf/facelets"
 xmlns:dim="http://dimetis.de/jsf">
 <a4j:jsFunction name="initServiceConfig" action="#{createTaskDialogBean.init}" reRender="playoutServiceListId"/>

 <rich:panel styleClass="backgroundNet">

 <h:panelGrid columns="2" style="margin-left:60px; margin-top:10px;">
 <h:outputLabel value="Port:" for="retrievalTaskRecordingPort"/>

 <h:selectOneMenu style="width : 255px;" id="retrievalTaskRecordingPort"
 value="#{createTaskDialogBean.selectedPortId}"
 styleClass="settingsColumns"
 onchange="alert('#{createTaskDialogBean.selectedPortId}');">
 <f:selectItems value="#{createTaskDialogBean.recordingTaskPorts}"/>
 <a4j:support event="onchange" ajaxSingle="true" oncomplete="disableNextButton();" />
 </h:selectOneMenu>
 <h:outputLabel value="Start Time:" for="continuousStorageStartTime" />

 <rich:calendar id="continuousStorageStartTime" popup="true" inputClass="settingsColumns" showApplyButton="true"
 datePattern="dd/MM/yyyy HH:mm" verticalOffset="-50" value="#{createTaskDialogBean.startTime}"/>

 <h:outputLabel value="Duration:" for="rContinuousDuration" />
 <a4j:outputPanel id="rContinuousDuration">
 <h:inputText styleClass="settingsColumns" onblur="validateSingleDuration(this)"
 value="#{createTaskDialogBean.duration}"/>
 <a4j:support event="onchange" reRender="rContinuousDuration"
 oncomplete="if ('#{createTaskDialogBean.duration}' != '') disableNextButton();"/>
 <h:outputText value=" (HH:MM:SS)" />
 </a4j:outputPanel>
 <rich:spacer height="95"/>
 <rich:spacer/>
 </h:panelGrid>
 </rich:panel>

 <h:panelGrid columns="4" style="margin-top:8px;vertical-align:bottom">
 <rich:spacer width="80"/>
 <a4j:commandButton value="<< Previous" style="float:left;width:110px;height:30px;" immediate="true" action="previous"/>

 <a4j:commandButton style="float:right;width:110px;height:30px;" onclick="refresh();Richfaces.hideModalPanel('taskWizard');" value="Cancel">
 <a4j:jsFunction name="refresh" action="#{createTaskDialogBean.refreshBean}" oncomplete="resetMask();"/>
 <a4j:jsFunction name="resetMask" action="reset" ajaxSingle="true"/>
 </a4j:commandButton>
 <a4j:commandButton value="Next >>" style="float:right;width:110px;height:30px;" onclick="initServiceConfig();"/>
 </h:panelGrid>
</ui:composition>

                  step 4 
                  <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:rich="http://richfaces.org/rich"
 xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
 xmlns:ui="http://java.sun.com/jsf/facelets"
 xmlns:dim="http://dimetis.de/jsf">
 <rich:panel styleClass="backgroundNet">
 <h:panelGrid columns="3" style="margin-left:60px; margin-top:10px;">
 <h:outputLabel value="Playout Type:" for="destinationPlayoutTypeId" />
 <rich:spacer width="28"/>
 <h:selectOneMenu id="destinationPlayoutTypeId" style="width: 256px;" value="#{createTaskDialogBean.outputType}">
 <f:selectItems value="#{createTaskDialogBean.destinationTypes}"/>
 <a4j:support event="onchange" ajaxSingle="true" reRender="playoutData" />
 </h:selectOneMenu>
 </h:panelGrid>

 <rich:separator style="height:1px;width:356px;margin-top:7px;margin-bottom:7px;margin-left:60px;margin-right:60px;"/>
 <a4j:outputPanel id="playoutData" >

 <a4j:outputPanel id="asimonitorId" layout="block" style="#{createTaskDialogBean.asiStyle}">
 <h:panelGrid columns="3" style="margin-left:60px;">
 <h:outputLabel value="Source Port:" for="monitorTaskSourcePortP"/>
 <rich:spacer width="16"/>
 <h:inputText id="monitorTaskSourcePortP" value="#{createTaskDialogBean.selectedPortName}"
 disabled="true" style=" width : 254px;"/>
 <h:outputLabel value="ASI Output Port:" for="monitorTaskAsiSinkPortp"/>
 <rich:spacer width="16"></rich:spacer>
 <h:selectOneMenu id="monitorTaskAsiSinkPortp" style="width : 258px;"
 value="#{createTaskDialogBean.asiSinkPort}" styleClass="settingsColumns"
 disabled="#{createTaskDialogBean.outputType=='Port IP'}">
 <f:selectItems value="#{createTaskDialogBean.monitorOutAsiPortItems}"/>
 </h:selectOneMenu>
 <h:outputLabel value="Loop" for="asiLoopId"></h:outputLabel>
 <rich:spacer width="16"/>
 <h:selectBooleanCheckbox value="#{createTaskDialogBean.asiLoop}" id="asiLoopId">
 </h:selectBooleanCheckbox>

 </h:panelGrid>
 </a4j:outputPanel>

 <a4j:outputPanel id="ipmonitorId" layout="block" style="#{createTaskDialogBean.ipStyle}">

 <h:panelGrid columns="3" style="margin-left:60px;">
 <h:panelGrid columns="3">
 <h:outputLabel value="Source Port:" for="monitorTaskIPSourcePortP"/>
 <rich:spacer width="5"/>
 <h:inputText id="monitorTaskIPSourcePortP" value="#{createTaskDialogBean.selectedPortName}"
 disabled="true" style="width : 167px;"/>
 <h:outputLabel value="IP Address:" for="monitorTaskIpAddressP"/>
 <rich:spacer width="5"/>
 <h:inputText id="monitorTaskIpAddressP" value="#{createTaskDialogBean.monitorIpAddress}"
 disabled="#{not createTaskDialogBean.outputType=='Port_IP'}"
 style="width : 167px;" onblur="validateIP(this);"/>
 <h:outputLabel value="IP Port:" for="monitorTaskIpPortNumberP"/>
 <rich:spacer width="5"/>
 <h:inputText id="monitorTaskIpPortNumberP" value="#{createTaskDialogBean.monitorIpPort}"
 disabled="#{not createTaskDialogBean.outputType=='Port_IP'}"
 style="width : 167px;" onblur="validatePort(this);"/>
 <h:outputLabel value="IP Hardware Port:" for="monitorTaskIpSinkPortP"/>

 <rich:spacer width="5"/>
 <h:selectOneMenu id="monitorTaskIpSinkPortP" style="width:172px"
 value="#{createTaskDialogBean.ipSinkPort}" styleClass="settingsColumns"
 disabled="#{not createTaskDialogBean.outputType=='Port_IP'}">
 <f:selectItems value="#{createTaskDialogBean.monitorOutIpPortItems}"/>
 </h:selectOneMenu>

 <h:outputLabel value="TS Packets:" for="ipPacketsP"/>

 <rich:spacer width="5"/>
 <h:selectOneMenu id="ipPacketsP" style="width:172px"
 value="#{createTaskDialogBean.ipPacketSize}" styleClass="settingsColumns"
 disabled="#{not createTaskDialogBean.outputType=='Port_IP'}">
 <f:selectItems value="#{createTaskDialogBean.ipPacketSizes}"/>
 </h:selectOneMenu>
 <h:outputLabel value="Loop" for="ipLoopIdP"></h:outputLabel>
 <rich:spacer width="5"></rich:spacer>
 <h:selectBooleanCheckbox value="#{createTaskDialogBean.ipLoop}" id="ipLoopIdP"/>
 </h:panelGrid>
 <rich:spacer width="1"/>
 <h:panelGrid>
 <h:outputLabel value="Protocol Type:" for="protocoltypeIdP"></h:outputLabel>
 <h:selectOneRadio id="protocoltypeIdP" value="#{createTaskDialogBean.selectedProtocolType}"
 layout="pageDirection">
 <f:selectItems value="#{createTaskDialogBean.protocolType}" />
 </h:selectOneRadio>
 </h:panelGrid>
 </h:panelGrid>
 </a4j:outputPanel>
 <a4j:outputPanel layout="block" id="File_DvdOutData" style="#{createTaskDialogBean.destinationFileStyle}">
 <h:panelGrid columns="2" style="margin-left:60px;">
 <h:outputLabel value="Filename:"/>
 <h:inputText value="#{createTaskDialogBean.outFile}" style=" width : 303px;"></h:inputText>
 </h:panelGrid>
 <rich:spacer height="100"></rich:spacer>
 </a4j:outputPanel>

 </a4j:outputPanel>
</rich:panel>
 <h:panelGrid columns="4" style="margin-top:8px;">
 <rich:spacer width="80"></rich:spacer>
 <a4j:commandButton value="<< Previous"
 style="float:left;width:110px;height:30px" ajaxSingle="true"
 immediate="true" action="#{createTaskDialogBean.backFromOut}"/>
 <a4j:commandButton style="float:right;width:110px;height:30px"
 onclick="Richfaces.hideModalPanel('taskWizard');" value="Cancel"
 action="reset" />
 <a4j:commandButton value="Finish"
 style="float:right;width:110px;height:30px"
 oncomplete=" if('#{createTaskDialogBean.outputType}' == 'Port_ASI')
 {
 if('#{createTaskDialogBean.asiSinkPort}' !='')
 {
 dataIsOk();
 }
 }else if('#{createTaskDialogBean.outputType}' == 'Port_IP')
 {
 if ('#{createTaskDialogBean.monitorIpAddress}' != '')
 if ('#{createTaskDialogBean.monitorIpPort}' != '')
 dataIsOk();
 }else
 {
 if('#{createTaskDialogBean.outFile}' != '')
 dataIsOk();
 }

 "/>
 <a4j:support event="onclick" reRender="monitorTaskIpPortNumberP, monitorTaskIpAddressP"/>
 <a4j:jsFunction name="dataIsOk"
 oncomplete="Richfaces.hideModalPanel('taskWizard');"
 action="#{createTaskDialogBean.createPlayoutTask}" />
 </h:panelGrid>

</ui:composition>


                  Navigation rule 

                   <navigation-rule>
 <from-view-id>/restricted/modal/createTaskWizard/createTaskStep1.xhtml</from-view-id>
 <navigation-case>
 <from-outcome>IN</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createRecordingTaskWizard.xhtml</to-view-id>
 </navigation-case>
 <navigation-case>
 <from-outcome>OUT</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep2Out.xhtml</to-view-id>
 </navigation-case>

 </navigation-rule>

 <navigation-rule>
 <from-view-id>/restricted/modal/createTaskWizard/createRecordingTaskWizard.xhtml</from-view-id>
 <navigation-case>
 <from-outcome>previous</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep1.xhtml</to-view-id>
 </navigation-case>

 <navigation-case>
 <from-outcome>reset</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep1.xhtml</to-view-id>
 </navigation-case>
 </navigation-rule>

 <navigation-rule>
 <from-view-id>/restricted/modal/createTaskWizard/createTaskStep2Out.xhtml</from-view-id>
 <navigation-case>
 <from-outcome>RETRIEVALCONT_STORAGE</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep2OutRStorage.xhtml</to-view-id>
 </navigation-case>
 <navigation-case>
 <from-outcome>RETRIEVAL_FILE</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep2OutRFile.xhtml</to-view-id>
 </navigation-case>
 <navigation-case>
 <from-outcome>RETRIEVAL_PLAYLIST</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep2OutRPlayList.xhtml</to-view-id>
 </navigation-case>

 <navigation-case>
 <from-outcome>MONITOR</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep2OutMonitor.xhtml</to-view-id>
 </navigation-case>

 <navigation-case>
 <from-outcome>previous</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep1.xhtml</to-view-id>
 </navigation-case>

 <navigation-case>
 <from-outcome>reset</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep1.xhtml</to-view-id>
 </navigation-case>
 </navigation-rule>

 <navigation-rule>
 <from-view-id>/restricted/modal/createTaskWizard/createTaskStep2OutRStorage.xhtml</from-view-id>

 <navigation-case>
 <from-outcome>previous</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep2Out.xhtml</to-view-id>
 </navigation-case>

 <navigation-case>
 <from-outcome>next</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep2OutService.xhtml</to-view-id>
 </navigation-case>

 <navigation-case>
 <from-outcome>reset</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep1.xhtml</to-view-id>
 </navigation-case>
 </navigation-rule>

 <navigation-rule>
 <from-view-id>/restricted/modal/createTaskWizard/createTaskStep2OutRFile.xhtml</from-view-id>

 <navigation-case>
 <from-outcome>previous</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep2Out.xhtml</to-view-id>
 </navigation-case>

 <navigation-case>
 <from-outcome>next</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep2OutService.xhtml</to-view-id>
 </navigation-case>

 <navigation-case>
 <from-outcome>reset</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep1.xhtml</to-view-id>
 </navigation-case>
 </navigation-rule>


 <navigation-rule>
 <from-view-id>/restricted/modal/createTaskWizard/createTaskStep2OutRPlayList.xhtml</from-view-id>

 <navigation-case>
 <from-outcome>previous</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep2Out.xhtml</to-view-id>
 </navigation-case>

 <navigation-case>
 <from-outcome>next</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep3Out.xhtml</to-view-id>
 </navigation-case>

 <navigation-case>
 <from-outcome>reset</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep1.xhtml</to-view-id>
 </navigation-case>
 </navigation-rule>

 <navigation-rule>
 <from-view-id>/restricted/modal/createTaskWizard/createTaskStep2OutService.xhtml</from-view-id>
 <navigation-case>
 <from-outcome>next</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep3Out.xhtml</to-view-id>
 </navigation-case>
 <navigation-case>
 <from-outcome>reset</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep1.xhtml</to-view-id>
 </navigation-case>

 <navigation-case>
 <from-outcome>previous</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep2OutRStorage.xhtml</to-view-id>
 </navigation-case>

 <navigation-case>
 <from-outcome>previousFile</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep2OutRFile.xhtml</to-view-id>
 </navigation-case>
 </navigation-rule>

 <navigation-rule>
 <from-view-id>/restricted/modal/createTaskWizard/createTaskStep2OutMonitor.xhtml</from-view-id>
 <navigation-case>
 <from-outcome>previous</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep2Out.xhtml</to-view-id>
 </navigation-case>

 <navigation-case>
 <from-outcome>reset</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep1.xhtml</to-view-id>
 </navigation-case>

 </navigation-rule>


 <navigation-rule>
 <from-view-id>/restricted/modal/createTaskWizard/createTaskStep3Out.xhtml</from-view-id>
 <navigation-case>
 <from-outcome>previous</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep2OutService.xhtml</to-view-id>
 </navigation-case>

 <navigation-case>
 <from-outcome>previousPlayList</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep2OutRPlayList.xhtml</to-view-id>
 </navigation-case>

 <navigation-case>
 <from-outcome>reset</from-outcome>
 <to-view-id>/restricted/modal/createTaskWizard/createTaskStep1.xhtml</to-view-id>
 </navigation-case>
 </navigation-rule>


                  problem is: forward works fine, no error, but go back crash the wizard. For example, step 1 go forward to step 4, then go back form step 4 to step1(only test), step 4 goback step 3, calls the setter method of selectedItem of step4, when step 3 go back to step 2, calls also the setter method of selectedItem of step 4 with null value, then crash the wizard.

                    • Actions