-1

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

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

<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 函数“更改”事件：这是 DOB 字段

<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 时，它会在事件日期 feild 中显示日期（dd/mm/yyyy）。但是如果我们单击特定字段（事件日期），更新的值将被删除，或者如果光标已经存在于事件中date feild js更新没有发生..提前谢谢

4

1 回答 1

0

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

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

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

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

于 2013-05-27T16:53:30.130 回答