首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >KO验证和bootstrap-datetimepicker时间选择器

KO验证和bootstrap-datetimepicker时间选择器
EN

Stack Overflow用户
提问于 2014-01-21 18:33:24
回答 1查看 1K关注 0票数 3

我正在尝试验证一个时间字段是否大于另一个。时间由bootstrap-datetimepicker输入,并通过KO验证进行验证。

我的问题是,验证似乎发生在文本框上的自动更正之前。

如何在应用自动更正后进行验证?

代码:

代码语言:javascript
复制
var vm = function () {
    var self = this;
    self.startTime = ko.observable().extend({ required: true });
    self.endTime = ko.observable()
    .extend({
        validation: {
            validator: function (val) {
                if (self.startTime() === '' || val === '') {
                    return true;
                }
                return new Date(val) > new Date(self.startTime());
            },
            message: 'Event must finish after it started'
        }
    });
    (function () {
        $('#event-start-time').datetimepicker({
            pickDate: false
        });
        $('#event-end-time').datetimepicker({
            pickDate: false
        });
        $('#event-end-time').on("change.dp", function (e) {
            //I've tried with and without this
            //self.endTime.valueHasMutated();
        });
    })();
};

结果:

Fiddle

EN

回答 1

Stack Overflow用户

发布于 2015-03-04 04:56:17

可能有点晚了,但这是我开发的:

假设您将结束日期作为一个可观察对象,然后使用自定义的“dateBefore”验证

代码语言:javascript
复制
    this.endDate = ko.observable(new Date().addHours(3).toGMTString()).extend({
        required: true,
        dateBefore: self.startDate()
    });

创建自定义验证:

代码语言:javascript
复制
    ko.validation.rules['dateBefore'] = {
        validator: function (val, otherVal) {
            var d1 = new Date(val),
                d2 = new Date(otherVal);
            return d1 > d2;
        },
        message: 'The end date must be before the start date'
    };
    ko.validation.registerExtenders();

如果您需要进一步的解释,请发表评论

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/21255554

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档