实际上，我彻底搜索了使用 java script 更新 <p:inputMask mask="99/99/9999"> 日期字段。但它不起作用答案

【问题标题】：Actually i searched thoroughly for updating a <p:inputMask mask="99/99/9999"> date field using java script.but its not working实际上，我彻底搜索了使用 java script 更新 <p:inputMask mask="99/99/9999"> 日期字段。但它不起作用
【发布时间】：2013-05-27 14:17:52
【问题描述】：

我想在任何表单元素发生更改时更新表单中的日期字段。表单是用素面完成的。

要更新的日期字段（事件日期）：

<p:inputMask mask="99/99/9999" 
             value="#{children.eventDate}" 
             converter="#{dateConverter}" 
             id="cfc_eventdate" 
             disabled="#{editFamilyCtrl.sendFlag||editFamilyCtrl.contextCtrl.viewFromWorklist}">
    <f:attribute name="childBirthDate" 
                 value="#{children.affiliateTO.childTOs[0].dateOfBirth}" />
    <f:validator validatorId="mwpEventDateValidator" />
    <p:watermark for="cfc_eventdate"  
                 value="dd/mm/yyyy" />
</p:inputMask>

我正在调用一个js函数“on change”事件：这是DOB feild

<p:column styleClass="borderStyle">
    <p:inputMask mask="99/99/9999" 
                 styleClass="#{(editFamilyCtrl.affiliateTOExist.dateOfBirth ne editFamilyCtrl.mutationRequestTO.mutationTOs[0].affiliateTO.dateOfBirth) and editFamilyCtrl.sendFlag ? 'updatedInput' : 'white'}"
                 value="#{editFamilyCtrl.mutationRequestTO.mutationTOs[0].affiliateTO.dateOfBirth}"
                 id="cfa_dob" 
                 disabled="#{editFamilyCtrl.sendFlag}" 
                 onchange="setEventDate(this)">
        <p:ajax event="blur" 
                update="@this" />
        <f:convertDateTime pattern="dd/MM/yyyy" />
        <f:validator validatorId="mwpdobValidator" />
    </p:inputMask>

    <h:outputLink disabled="#{editFamilyCtrl.sendFlag}" 
                  onclick="calDialog.show()" 
                  value="javascript:void(0)" 
                  styleClass="calStyle">
        <p:graphicImage value="../images/calendar.png" 
                        styleClass="calImg"/>
     </h:outputLink>
</p:column>

这是我的 Js 函数：

<script>
    function setEventDate(val) {      
      var obj = document.getElementById("editFamilyForm:cfa_eventdate");
      if(!((obj.value).match(/^\d+/))) {
          var today = new Date();
          var dd = today.getDate();
            var mm = today.getMonth()+1; 
            var yyyy = today.getFullYear();
            var today=dd+"/"+mm+"/"+yyyy;
            $("#editFamilyForm\\:cfa_eventdate").val(today);
        }
    }
</script>

在更改上面 js 的 dob 字段时，它会在事件日期 feild 中显示日期（dd/mm/yyyy）。但是如果我们单击特定字段（事件日期），更新的值将被删除或者如果光标已经存在存在于事件日期字段 js 更新未发生..在此先感谢

【问题讨论】：

@kamwo：请不要进行此类小更新。由于编辑，该帖子上升到“活跃主题列表”的顶部。仅当有其他编辑可以改进问题时才编辑这样的内容（标题在许多其他方面都非常错误）

标签： javascript date jsf-2 primefaces

【解决方案1】：

指定<p:ajax event="blur" update="@this" /> 意味着每当cfc_eventdate 组件上发生任何光标移动时，它的值将通过服务器端刷新进行ajax 更新。

由于您使用纯客户端 js 更改 cfc_eventdate 的值，因此它的值不会存储在服务器端。因此，如果在setEventDate()函数运行后出现任何光标移动，将会发生以下情况

客户端值（显示在组件上）将在组件上更新
<p:ajax/> 将触发对服务器的 ajax 请求
服务器将接收请求并查找cfc_eventdate的值绑定，即#{children.eventDate}。因为 JSF 没有意识到纯粹的客户端更新，children.eventDate 将保留它原来的服务器端值。正是这个原始值将在 ajax 响应中发送到 (2)。

在流程结束时，您所做的任何客户端更改都将通过 ajax 响应撤消。关键是：如果你想根据另一个组件的值来更新一个组件，请使用正确的 ajax，而不仅仅是 javascript。

【讨论】：