Question

我希望在更改任何表单元素时更新表单中的日期字段。使用主要表面完成表单。

日期费用（活动日期）待更新：

<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>

在更改dob feild上面的js被调用并在事件日期feild中显示日期（dd / mm / yyyy）。但是如果我们点击特定字段（事件日期），更新的值将被删除或光标已经被删除在事件日期出现feild js更新没有发生..谢谢提前

Answer 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。

实际上我彻底搜索了使用java脚本更新<p：inputmask mask =“99/99/9999”>日期字段。但它无法正常工作</p：inputmask>

1 个答案: