帶有素數的動態頁面內容

Question

我正在創建一個網頁。內容應根據用戶選擇而改變。

我需要2個單選按鈕，可以選擇一天和多天（開始日期和結束日期），如果一天選擇頁面應該顯示一個日曆選擇日期，否則兩個日曆選擇開始日期和結束日期I試圖用渲染歡迎使用屬性與阿賈克斯，但我不能查看壓延我怎麼能做到這一點

我XHTML

<h:form id="f1"> 
        <p:growl id="createmsg"/> 
        <h:panelGrid columns="2" cellpadding="10"> 
         <p:panel id="add_visitor_details_pnl" style="width:100%"> 
          <h:panelGrid id="grid" columns="2" cellpadding="10"> 
           <h:outputText value="Organization :" /> 
           <p:selectOneMenu editable="true" value="#{visitorBean.organization}" style="width:160px" filter="true" filterMatchMode="startsWith"> 
            <f:selectItems value="#{visitorBean.organizations}" /> 
           </p:selectOneMenu> 
           <h:outputText value="Visitor Name :" /> 
           <p:selectOneMenu value="#{visitorBean.name}" style="width:160px" filter="true" filterMatchMode="startsWith"> 
            <f:selectItems value="#{visitorBean.names}" /> 
           </p:selectOneMenu> 
           <h:outputText value="Visitor ID :" /> 
           <p:selectOneMenu value="#{visitorBean.id}" style="width:160px" filter="true" filterMatchMode="startsWith"> 
            <f:selectItems value="#{visitorBean.ids}" /> 
           </p:selectOneMenu>               
           <h:outputText value="Purpose :" /> 
           <p:inputTextarea id="purpose_it" value="#{visitorBean.purpose}" required="true" autoResize="false" 
              requiredMessage="Enter Purpose" rows="10" cols="50"/> 
          </h:panelGrid> 
          <h:panelGrid columns="1" cellpadding="10"> 
           <p:selectOneRadio id="customRadio" value="#{visitorBean.option}" > 
            <f:selectItem itemLabel="Create a one day appointment" itemValue="1" /> 
            <f:selectItem itemLabel="create a day period appointment" itemValue="2" /> 
            <p:ajax event="change" listener="#{visitorBean.selectDayType()}" 
              update=":f1:add_visitor_details_pnl"  /> 
           </p:selectOneRadio> 
          </h:panelGrid> 
          <h:panelGrid id="date" columns="3" cellpadding="10"> 
           <h:outputText id="date1" value="Date" rendered="#{visitorBean.cal1}"/> 
           <p:calendar id="calender_Cal1" value="#{visitorBean.date_time}" 
              pattern="yyyy-MM-dd" rendered="#{visitorBean.cal1}" 
              required="true" requiredMessage="Enter Date Time"/> 
           <p:calendar id="calender_Cal2" value="#{visitorBean.date_time}" 
              pattern="yyyy-MM-dd" rendered="#{visitorBean.cal2}" 
              required="true" requiredMessage="Enter Date Time"/> 
          </h:panelGrid> 
          <h:panelGrid columns="2" cellpadding="10"> 
           <p:commandButton id="submit_visitor_Btn" value="Create"               
               action="#{visitorBean.submitVisitorData()}" 
               update=":f1:visitor_dataTable,:f1:grid,:f1:createmsg"/> 



          </h:panelGrid> 

我的AJAX mthod

public void selectDayType(){ 
    if(option =="1") 
     cal1 = "true"; 
    else if(option =="2"){ 
     cal1="true"; 
     cal2="true";    
    } 

Answer 1

嘗試周圍的日曆與一個：

<p:outputPanel id="someId" > 
... 
</p:outputPanel> 

Primefaces - Output Panel