日曆在Primefaces移動

我正在尋找在日常移動中使用「日曆」組件挑選日期： <p:calendar value="#{bean.date}" pattern="MM/dd/yyyy HH:mm" /> 日曆彈出但它看起來很奇怪。它以透明的方式重疊頁面內容。日曆在Primefaces移動

是否有解決此問題的方法？或者讓它在對話框中正確彈出的方法？也許把另一個框架與Primefaces結合起來？

順便說一句，對話似乎不適用於Primefaces Mobile。

感謝

來源

2011-09-14 codyLine

Primefaces移動是真正偉大的，仍處於開發階段，但它沒有實現像「datebox」 jQuery Mobile的擴展。我找到了一種結合兩者的方法。我包括在JSF頁的標頭中的jquery-datebox庫（參見link）：

<f:view xmlns="http://www.w3.org/1999/xhtml" 
     xmlns:f="http://java.sun.com/jsf/core" 
     xmlns:h="http://java.sun.com/jsf/html" 
     xmlns:pm="http://primefaces.prime.com.tr/mobile" 
     xmlns:p="http://primefaces.prime.com.tr/ui" 
     contentType="text/html"> 

    <pm:page title="Faces"> 

     <f:facet name="postinit">    
      <h:outputStylesheet library="css" name="jquery.mobile-1.0b3.min.css" /> 
      <h:outputStylesheet library="css" name="jquery.mobile.datebox.min.css" />    
      <h:outputScript library="primefaces" name="mobile/mobile.js" /> 
      <h:outputScript library="js" name="jquery.mobile.datebox.min.js" /> 
     </f:facet> 

     <!-- Main View --> 
     <pm:view id="main" swatch="b"> 
      <pm:header title="Hello"> 
       <f:facet name="left"> 
        <pm:button value="Back" icon="back" role="back"/> 
       </f:facet> 
      </pm:header> 

      <pm:content> 
       <h:form id="myform"> 
        <h:outputText value="Input: " /> 
        <h:inputText id="input" />      
       </h:form>     
      </pm:content> 

      <label for="mydate">Date: </label>                   
      <input name="mydate" id="mydate" type="date" data-role="datebox" value="#{mybean.date}" 
        data-options='{"mode": "calbox"}' /> 

      <div data-role="fieldcontain"> 
        <label for="slider">Duration: </label> 
        <input type="range" name="slider" id="slider" 
          value="#{mybean.duration}" min="1" max="10" /> 
      </div> 

      <pm:content> 
       <h:form id="Form"> 
       <pm:field> 
        <h:outputLabel for="duration" value="duration: "/> 
        <pm:slider id="duration" min="1" max="10" value="#{mybean.duration}"/> 
       </pm:field> 
       </h:form> 
      </pm:content> 

     </pm:view> 
    </pm:page> 

</f:view>

該日期選擇器工作得很好，但兩個滑塊內部和PM-視圖（見代碼）的外部顯示像正常輸入！

有什麼建議嗎？謝謝

PS：@administrator：需要一個新標籤：「Primefaces-mobile」

來源

2011-09-16 10:18:37 codyLine

日曆在Primefaces移動

回答

相關問題