javascript - 验证多个日期字段

标签 javascript angularjs validation angularjs-directive

我正在创建一个表单,我有一个用于开始日期和结束日期的日期选择器和时间选择器。 所以我总共有 4 个字段。 我希望能够验证开始日期(开始日期和开始时间的组合)是否早于结束日期。但我似乎无法弄清楚应该在哪里以及如何进行此验证。

因此,每当编辑其中一个字段时,它都应该触发验证。

我似乎无法弄清楚在哪里以及如何创建此验证,我尝试创建一个名为 method-validation 的自定义验证,它可以从 Controller 检索方法,然后决定验证是否正确,但是我不能仅将其放在一个字段上,因为如果我更改其他字段,验证将不会被触发。

如何让它发挥作用?

底线是,我希望能够将 2 个和 2 个字段设置在一起,然后比较它们,如果 end 小于 start,则显示一条消息。

跟进:

问题不在于比较两个日期。我能实现的。

<input type="text" ng-model="activity.startDate" date-picker>
<input type="text" ng-model="activity.startTime" time-picker>

<input type="text" ng-model="activity.endDate" date-picker>
<input type="text" ng-model="activity.endTime" time-picker>

确保两个字段的组合没有关闭

最佳答案

module.directive('validDate', function(){
    return {
        require: 'ngModel',
        link: function(scope, elm, attrs, ctrl) {
            function  validator(value){
                var valid = true;
                if (value != undefined) {
                  value = moment(value, 'YYYY-MM-DD').format('YYYY-MM-DD'); 
                  if (((attrs.validDate == 'start') && (value >= scope.$eval(attrs.otherDate))) || ((attrs.validDate == 'end') && ((value < scope.$eval(attrs.otherDate))))) {
                    valid = false;
                  }                        
                 } else {
                   valid = false;
                 }

                ctrl.$setValidity('date-valid', valid); 
                return value;
            }

            scope.$watch([attrs.otherDate, attrs.ngModel] ,function(newValue) {
                validator(scope.$eval(attrs.ngModel));
                }, true);                        
        }
    };
});

用法:

<input type="date" ng-model="startDate" valid-date="start" other-date="endDate" />
<input type="date" ng-model="endDate" valid-date="end" other-date="startDate" />

让我知道它是否有效。我用了MomentJS library此处可设置格式,但请随意更改。

关于javascript - 验证多个日期字段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27014155/

相关文章:

javascript - 使用种子字符串在 mongoose 中创建 ObjectId

javascript - 使用kineticjs 4.7.4和jquery.mousewheel.js进行平移和缩放

javascript - Chartjs-plugin-dragdata 不适用于散点图

javascript - ionic 切换值保持不变

angularjs - 如何检查我的元素是否已集中在单元测试中

javascript - Angularjs 应用程序无法通过 POST 方法跨域

javascript - 使用 jquery.validate.min.js 验证输入数组形式

PHP:如何更改 SQL 中验证的值?

javascript - 循环表以获取 TD 的结果

c# - ValidationMessage 不会更改文本编辑器边框的颜色