2014-01-10 2 views
0

j2ee 웹 응용 프로그램 (jsf2 및 primefaces)에서 작업하고 있는데 하나의 메뉴에서 선택한 항목에 따라 양식을 표시하는 방법이 궁금합니다. 시도했지만 작동하지 않았습니다.selectOneMenu의 항목을 선택할 때 양식 표시

<h:form id="global"> 
    <p:panel header="Association"> 
     ... 
    <p:outputLabel value="Travel Class" />  
    <p:selectOneMenu id="associationType" style="width: 230px" value="#{associationMBean.travelClass}"> 
              <f:selectItem itemLabel="Select one" itemValue="" /> 
              <f:selectItem itemLabel="Seminar" itemValue="Seminar" /> 
              <f:selectItem itemLabel="Honeymoon" itemValue="Honeymoon" /> 
              <f:selectItem itemLabel="Organized Trip" itemValue="Organized Trip" /> 
              <p:ajax update=":hidePanel"/> 
             </p:selectOneMenu>  
    </p:panel> 
</h:form> 
<p:panel id="hidePanel" style="margin-top: 20px; font-size: 14px; border: 0;display: none " header="Remarks (Optional)" rendered="#{associationMBean.travelClass eq Seminar}"> 
<h:form>    
<p:inputTextarea style="width: 100% ; height: 100px" value="#{associationMBean.description}" ></p:inputTextarea> 
</h:form>    
</p:panel> 

업데이트

<html 
    xmlns:f="http://java.sun.com/jsf/core" 
    xmlns:h="http://java.sun.com/jsf/html" 
    xmlns:p="http://primefaces.org/ui"> 
    <h:head> 
     <title>Visa Application-Thailand</title> 

    </h:head> 
    <h:body> 
     <div align="center"> 
      <div> 
       <img class="logo" src="images/banner.jpg"/> 
      </div> 
      <p:panel style="width: 61%; border-color: indianred; border-width: 2px; margin-top: 10px"> 
       <h:form id="global"> 
        <p:panel style="margin-top: 20px; font-size: 14px ; border: 0" header="Association"> 
         <table border="0" > 
          <tbody > 
           <tr> 
            <td align="right"> 
             <p:outputLabel value="Association Type" /> 
            </td > 
            <td align="left"> 
             <p:selectOneMenu id="selectmenu" style="width: 230px" value="#{associationMBean.type}"> 
              <f:selectItem itemLabel="Select a Class" itemValue="" /> 
              <f:selectItem itemLabel="Seminar" itemValue="Seminar" /> 
              <f:selectItem itemLabel="Organized Trip" itemValue="Organized Trip" /> 
              <f:selectItem itemLabel="Honeymoon" itemValue="Honeymoon" /> 
              <p:ajax update=":hidePanel"/> 
             </p:selectOneMenu> 

            </td> 
           </tr> 

           <tr> 
            <td align="right"> 
             <p:outputLabel value="Date of Departure" for="departure" /> 
            </td> 
            <td align="left"> 
             <p:calendar value="#{associationMBean.departure}" showOn="button" pattern="dd/MM/yy" style="width: 250px" id="departure"></p:calendar> 
             <p:watermark value="01/01/2014" for="departure"/> 
            </td> 
           </tr> 
           <tr> 
            <td align="right"> 
             <p:outputLabel value="Date of Arrival" for="arrival" /> 
            </td> 
            <td align="left"> 
             <p:calendar value="#{associationMBean.arrival}" showOn="button" pattern="dd/MM/yy" style="width: 250px" id="arrival"></p:calendar> 
             <p:watermark value="01/01/2014" for="arrival"/> 
            </td> 
           </tr> 
           <tr> 
            <td align="right"> 
             <p:outputLabel value="Travel Agency " for="travelAgency"/> 
            </td> 
            <td align="left"> 
             <p:inputText id="travelAgency" value="#{associationMBean.travelAgency}" style="width: 220px"></p:inputText> 
            </td> 
           </tr> 
           <tr> 
            <td align="right"> 
             <p:outputLabel value="Airline " for="airline"/> 
            </td> 
            <td align="left"> 
             <p:inputText id="airline" value="#{associationMBean.airline}" style="width: 220px"></p:inputText> 
            </td> 
           </tr> 
           <tr> 
            <td align="right"> 
             <p:outputLabel value="Travel Class" /> 
            </td > 
            <td align="left">   
             <p:selectOneMenu id="selectclass" style="width: 230px" value="#{associationMBean.travelClass}"> 
              <f:selectItem itemLabel="Select a Class" itemValue="" /> 
              <f:selectItems value="#{associationMBean.allClasses}" /> 
              <!-- <p:ajax update=":hidePanel"/> !--> 
             </p:selectOneMenu>         
            </td> 
           </tr> 

           <tr > 
            <td align="right"> 
             <p:outputLabel value="Hotels " for="hotels" /> 
            </td> 
            <td align="left"> 
             <p:inputTextarea id="hotels" value="#{associationMBean.hotels}" style="width: 220px"/> 
            </td> 
           </tr>    
          </tbody> 
         </table> 
        </p:panel> 
        <div align="right" style="margin-top: 20px "> 
         <p:commandButton type="reset" value="Reset" style="font-size: 14px;"/> 
         <p:commandButton value="Save" ajax="false" styleClass="ui-priority-primary" style="font-size: 14px;" action="#{associationMBean.addAssociation()}" /> 
        </div> 
       </h:form>    
       <p:panel id="hidePanel" style="margin-top: 20px; font-size: 14px; border: 0;display: none " header="Remarks (Optional)" > 
        <h:form rendered="#{associationMBean.type == 'Seminar'}" > 
         <p:inputTextarea style="width: 100% ; height: 100px" value="#{visaMBean.description}" ></p:inputTextarea> 
        </h:form> 
       </p:panel>   
      </p:panel> 
     </div> 
    </h:body> 
</html> 

위의 코드를 일부 업데이트 <h:form rendered="#{associationMBean.type == 'Seminar'}" >를 추가 한 후 전체 HTML 코드입니다하지만 난이 selectOneMenu에서 세미나를 선택할 때 여전히 hidePane를 표시 할 수 없습니다. 내가 무엇을 놓치고 있는지 당신이 생각해 봤나 ?? ??

+2

hidePanel을 outputPanel로 둘러싸고이 outputPanel을 업데이트하십시오. –

+0

세미나를 선택하면 같은 문제가 발생합니다. –

+0

레오 자오 (Leo Zhao)의 조언이 해결책입니다. 렌더링 된 속성이 false로 평가 되었기 때문에 패널이 HTML 페이지가 없기 때문에, 존재하는 dom 요소 만 업데이트 할 수 있습니다 HTML 페이지. – landal79

답변

1

다음은 작동합니다 : 당신은 DOM에없는 및 구성 요소가 렌더링되지 않습니다 때 거기에없는 구성 요소를 업데이트 할 수 없습니다

<p:panel id="hidePanel" style="margin-top: 20px; font-size: 14px; border: 0;display: none " header="Remarks (Optional)"> 
    <h:form rendered="#{associationMBean.travelClass eq 'Seminar'}"> 
    <p:inputTextarea style="width: 100% ; height: 100px" value="#{associationMBean.description}" ></p:inputTextarea> 
    </h:form>    
</p:panel> 

. 따라서 조건부로 렌더링 된 구성 요소의 부모를 업데이트해야합니다. 그리고 #{associationMBean.travelClass}'Seminar'을 작은 따옴표로 묶어야하는 문자열입니다 (').

+0

associationMBean.travelClass가 열거 형인 경우는 어떻습니까 ??? –

+0

이 질문을보십시오. http://stackoverflow.com/questions/2524420/how-to-testing-for-enum-equality-in-jsf – user1983983

관련 문제