ORACLE APEX 5.0 中表格形式的动态计算和验证

Question

我正在 oracle apex 中构建表格形式，我需要验证 开始日期 和 结束日期。

开始日期和结束日期都有表格形式的日期选择器字段，开始日期不应接受小于 45 的日期从系统日期（今天的日期）开始的天数，并且不应大于系统日期。

即使我将开始日期指定为今天的日期，我也会收到错误消息。当 start_date 小于（今天的日期 - 45 天）时，我需要警报

我正在使用 ORACLE APEX 5.0 版本

在页面上，我在“函数和全局变量声明”部分定义了这个函数：

function f_validate_sd(pThis) { 

  var row_id      = pThis.id.substr(4);  
  var start_date  = $('#f10_'+row_id).val();
  //var end_date    = $('#f11_'+row_id).val();


 var currentDate = new Date();
 var dy          = currentDate.getDate();
 var month       = currentDate.getMonth() + 1;
 var year        = currentDate.getFullYear();
 var sd          = (  dy + "-" + month + "-" + year);

 var subdate     = new Date(sd); 
 var numberOfDaysToAdd = 45;
 subdate.setDate(subdate.getDate() - numberOfDaysToAdd );
 var dd          = subdate.getDate();
 var mm          = subdate.getMonth() + 1;
 var yy          = subdate.getFullYear();
 var sub         = ( dd + "-" + mm + "-" + yy );

alert(start_date);
    alert(sub);
alert(start_date - sub );
    alert(sd);

if(start_date < sub  ) {
                 alert("START DATE should be within 45 days from todays date");
                 $('#f10_'+row_id).val(" ");}
}

在表格形式中，我通过将其添加到“START_DATE”列的“自定义属性”字段来调用此函数：

onchange="javascript:f_validate_sd(this);"

当我运行我的页面并更改日期时，消息“NaN”作为第三个警报。

我在这里设置了一个示例应用程序： DEMO

您可以使用以下凭据在 apex.oracle.com 上进行检查：

工作区：APEX_CHECKBOX
用户名：appuser
密码：演示

Answer 1

定义支票：
在 JavaScript 中使用一些真实的日期算法。

页面>函数和全局变量声明

我已经修改了我在上一个答案中使用的一些代码：Comparing dates using Dynamic Action on DatePicker Oracle Apex

function isBetweenNowAnd(pDateItem, pRange){  
  function getRange(pRange){ 
    var future = new Date();
    future.setDate(future.getDate() + pRange);
    return future;
  };

  function cutTime(pDate){
    return new Date(pDate.getFullYear(), pDate.getMonth(), pDate.getDate());
  };

  // check if pDateItem leads to a selection
  // check if it is a datepicker
  // check if a date has been selected
  // if pRange is at least a number
  if ( $(pDateItem).length 
       && $(pDateItem).data("datepicker")
       && $(pDateItem).datepicker("getDate") !== null 
       && parseInt(pRange) !== "NaN"
     ) 
  {        
    var future = getRange(pRange);
    var check = $(pDateItem).datepicker("getDate");
    var one = cutTime(check);
    var two = cutTime(future);

    return one <= two;
  };
  return false;
}

我真的很讨厌使用“onxxx”属性。这只是您自己的应用程序中的混淆。如果您不知道如何使用 javascript 或 jQuery，那么请阅读而不是使用这些烦人的属性来轻松解决问题。
此动态操作将在开始日期更改时触发，并且仅在满足表达式中的条件时触发真正的操作：项目不为空（当用户空白选择时不触发）并且日期超出45 天限制。
然后第一个操作显示警报，第二个操作将空白字段。

动态动作 - 检查边界

• 事件：更改
• 选择类型：jQuery 选择器
• jQuery 选择器：td[headers=START_DATE] input.hasDatepicker
• 条件：JavaScript 表达式
• 表达式：!apex.item(this.triggeringElement).isEmpty() && !isBetweenNowAnd(this.triggeringElement, 45)

真正的行动：

操作 1：警报

• 文本：开始日期必须在今天的 45 天内！
• 页面加载时触发：否

动作2：设定值

• 设置类型：JavaScript 表达式
• 表达式：""
• 抑制更改事件：是
• 页面加载时触发：否
• 受影响的元素：触发元素

---

UX：不要让用户通过 UI 选择过去今天 + 45 的日期开始 使用以前的 DA，您可以阻止手动更改项目（更改日期文本而不使用弹出窗口）以及 UI 上的选择，但您也可以在日期选择器中禁用不适用的日期。
此 DA 将在刷新表格形式（例如分页）以及页面加载后触发。它将设置日期选择器的最大可选日期。

动态动作 - 检查边界

• 事件：刷新后
• 选择类型：地区
• 区域：（选择表格区域）

操作：执行 JavaScript

• 代码：

  $("td[headers=START_DATE] input.hasDatepicker").each(function(){
    $(this).data("datepicker").settings.maxDate = "+45"; 
  })
  

• 没有受影响的元素

• 页面加载时触发：是

（有人想知道我为什么不直接调用 $("...").datepicker("option","maxDate","+45")：这会破坏通用主题中日期选择器的视觉效果，因为它会从对话框按钮中删除类）

---

考虑到可以绕过 JavaScript。操作日期并能够保存它并不难。但是，尝试添加服务器验证并没有真正的用处，因为您只能指定“针对已创建和修改的行” - 这将触发对与上述记录无关的变化。但你应该知道。如果您的表上有该审计列，您可以使用检查日期与记录的“创建”日期的验证。

---

我已在“第 3 页 - 更新 TOM”的链接应用程序中构建了这些内容，因此您可以在那里查看。