ASP MVC jQuery验证onfocusout工作,但不提供表单提交

时间:2014-11-06 11:03:12

标签: javascript jquery asp.net-mvc jquery-validate

我的ASP MVC项目和jQuery客户端验证有问题。 问题是,当按下提交按钮时,表单将被验证,但不会显示错误,并且表单将被提交。 问题只出现在我在验证方法中调用valid()时出现。 例如:我有一个isdatebefore和isdateafter验证方法。 我想检查#start是否在#end之前。 因此,在验证#start时,它还会在#end上调用验证,以确保错误消息在两个元素上显示/消失。 我添加了onfocusout验证,这工作得很好(在#start和#ejnd字段以及表单中的所有其他字段)。 但是,当我按下提交按钮时,表单被验证(我放置了一些断点以查看方法是否被调用),但是虽然存在错误但仍会提交。

这是我的代码:

// Add IsDateAfter validation
$.validator.addMethod("isdateafter", function (value, element, params) {
    var self = $(element);
    var parts = element.name.split(".");
    var prefix = "";
    for (var i = 0; i < parts.length - 1; i++)
        prefix = parts[i] + ".";
    var otherElement = $('input[name="' + prefix + params.propertytested + '"]');
    var startdatevalue = otherElement.val();
    if (!value || !startdatevalue)
        return true;
    var allowequal = params.allowequaldates.toLowerCase() === "true";
    var start = Globalize.parseDate(startdatevalue);
    var end = Globalize.parseDate(value);
    if (!self.data('reval')) {
        self.data('reval', true);
        otherElement.data('reval', true);
        otherElement.valid();
        self.data('reval', false);
        otherElement.data('reval', false);
    }
    var isValid = allowequal ? start <= end :
        start < end;
    if (isValid) {
        self.removeClass('input-validation-error');
    }
    return isValid;
});

$.validator.unobtrusive.adapters.add(
    'isdateafter', ['propertytested', 'allowequaldates'], function (options) {
        options.rules['isdateafter'] = options.params;
        options.messages['isdateafter'] = options.message;
    });

// Add IsDateBefore validation
$.validator.addMethod("isdatebefore", function (value, element, params) {
    var self = $(element);
    var parts = element.name.split(".");
    var prefix = "";
    for (var i = 0; i < parts.length - 1; i++)
        prefix = parts[i] + ".";
    var otherElement = $('input[name="' + prefix + params.propertytested + '"]');
    var startdatevalue = otherElement.val();
    if (!value || !startdatevalue)
        return true;
    var allowequal = params.allowequaldates.toLowerCase() === "true";
    var start = Globalize.parseDate(startdatevalue);
    var end = Globalize.parseDate(value);
    if (!self.data('reval')) {
        self.data('reval', true);
        otherElement.data('reval', true);
        otherElement.valid();
        self.data('reval', false);
        otherElement.data('reval', false);
    }
    var isValid = allowequal ? start >= end :
        start > end;
    if (isValid) {
        $(element).removeClass('input-validation-error');
    }
    return isValid;
});

$.validator.unobtrusive.adapters.add(
    'isdatebefore', ['propertytested', 'allowequaldates'], function (options) {
        options.rules['isdatebefore'] = options.params;
        options.messages['isdatebefore'] = options.message;
    });

代码在onfocusout事件中工作正常,但是在onsubmit事件中调用了问题。 当我删除对otherElement.valid()的调用;一切都恢复正常(但我需要验证其他元素才能正常工作)。

那么有人知道如何在验证一个元素的同时继续验证这两个元素并且仍然没有搞砸提交吗?

1 个答案:

答案 0 :(得分:1)

您不能在另一个jQuery Validate方法中使用.valid()方法。

Use .element() instead ...

$('#yourForm').validate().element(otherElement);

或使用关键字this,它代表插件自己的方法中的validator对象......

this.element(otherElement);

或者您已经验证已正常工作(如果this关键字有效,有点重复)...

otherElement.parents('form').validate().element(otherElement);