Question

<h:column>
    <f:facet name="header">
        <h:outputLabel value="#{label.asOfDate}" style="font-weight:bold" />
        <h:outputLabel value="*"
            style="font-weight:bold; color:red; font-size:150%" />
    </f:facet>

    <p:calendar id="date" required="true" navigator="true"
        mindate="#{utils.minDate}" pattern="#{label.dateFormat}"
        maxdate="#{utils.maxDate}" value="#{policy.asOfDt}"
        requiredMessage="#{label.asOfDateRequired}" showOn="button">
        <f:validator validatorId="CustomDateValidator" />
    </p:calendar>

</h:column>

我希望日期文本字段应采用屏蔽格式（11/11/2011）和日历按钮。我们可以在日历中应用掩码操作吗？

Answer 1

您可以使用以下内容： `

<script type="text/javascript" language="JavaScript">
          var $ = jQuery;
          $(document).ready(function() {
              $("input[id*='Date']").mask('99/99/9999');
          });
     </script>
     <p:calendar id="documentDate" />

`

Answer 2

自Primefaces 5.0以来，您可以使用日历的掩码属性：

mask="99/99/9999"

Answer 3

应用datePattern属性

datePattern="MM/dd/yyyy"

Answer 4

关于this post，这是不可能的。 PF首席开发人员回答了这个问题（所以请相信他;-)。他建议结合jquery（http://digitalbush.com/projects/masked-input-plugin/）编写一个复合组件。

Answer 5

INMO，如果你必须使用额外的jquery插件来实现这个任务，你最好使用jquery：calendar和mask（需要很少的额外代码来将bean值绑定到负责日历的输入）

看看这个解决方案

Mask the date format when using jQuery UI datepicker

和

Small jsfiddle example

和另一个

Using jQueryUI Datepicker And Input Masking Together

Answer 6

您可以通过将输入字段设置为readonly来强制用户选择日期来解决此问题。

以下是要添加到输入字段以强制执行此操作的属性：

readonlyInput="true"

我们可以使用<p：calendar> </p：calendar>应用蒙版操作

6 个答案: