JQuery的1.5休息比较验证（JQuery验证1.8） [英] JQuery 1.5 breaks Compare Validate (JQuery Validate 1.8)

问题描述

升级到JQuery的1.5及更高版本1.5.1后，我比较验证失败。我使用JQuery.Validate 1.7。我的视图模型具有以下数据说明：

After upgrading to JQuery 1.5 and later 1.5.1, my compare validation fails. I'm using JQuery.Validate 1.7. My ViewModel has the following data annotations:

/// <summary>
/// Gets or sets the full name.
/// </summary>
/// <value>The full name.</value>
[Required]
[Display(Name = "fullname", ResourceType = typeof(Milkshake.Commerce.Model.Resources.Text))]
public string FullName { get; set; }

/// <summary>
/// Gets or sets the email.
/// </summary>
/// <value>The email.</value>
[DataType(DataType.EmailAddress)]
[Display(Name = "email", ResourceType = typeof(Milkshake.Commerce.Model.Resources.Text))]
[Required(ErrorMessageResourceName = "EmailRequired", ErrorMessageResourceType = typeof(Milkshake.Commerce.Model.Resources.ValidationMessages))]
[RegularExpression(@"\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*", ErrorMessageResourceType = typeof(Milkshake.Commerce.Model.Resources.ValidationMessages), ErrorMessageResourceName = "EmailInvalid")]
public string Email { get; set; }

/// <summary>
/// Gets or sets the password.
/// </summary>
/// <value>The password.</value>
[DataType(DataType.Password)]
[Display(Name = "password", ResourceType = typeof(Milkshake.Commerce.Model.Resources.Text))]
[Required(ErrorMessageResourceName = "PasswordRequired", ErrorMessageResourceType = typeof(Milkshake.Commerce.Model.Resources.ValidationMessages))]
[ValidatePasswordLengthAttribute(ErrorMessageResourceName = "PasswordLength", ErrorMessageResourceType = typeof(Milkshake.Commerce.Model.Resources.ValidationMessages))]
public string Password { get; set; }

/// <summary>
/// Gets or sets the confirm password.
/// </summary>
/// <value>The confirm password.</value>
[DataType(DataType.Password)]
[Display(Name = "confirmPassword", ResourceType = typeof(Milkshake.Commerce.Model.Resources.Text))]
[Required(ErrorMessageResourceName = "PasswordRequired", ErrorMessageResourceType = typeof(Milkshake.Commerce.Model.Resources.ValidationMessages))]
[Compare("Password", ErrorMessageResourceName = "PasswordsMustMatch", ErrorMessageResourceType = typeof(Milkshake.Commerce.Model.Resources.ValidationMessages))]
public string ConfirmPassword { get; set; }

我输入什么都值，密码字段是永远不会相同的。

What ever value I enter, the password fields are never identical.

更新 - ASP.NET AntiForgeryToken变得麻烦

在Firebug中设置断点鬼混后，我注意到，在equalTo验证功能，开始在jquery.validate.js线1065，即找到目标元素，是不是密码字段 - 但 __ RequestVerificationToken ，当你使用 Html.AntiForgeryToken（）帮手ASP.NET MVC写道。

After fooling around in FireBug setting breakpoints, I noticed that in the equalTo validation function, starting on line 1065 in jquery.validate.js, the target element that is found, is not the Password field - but the __RequestVerificationToken that ASP.NET MVC writes when you use the Html.AntiForgeryToken() helper.

因此​​，这意味着我们甚至没有比较正确的输入元素。要解决这个问题，我添加了一个肮脏的黑客到jquery.validate.js文件：

So that means we're not even comparing the correct input elements. To work around this issue, I added a dirty hack to the jquery.validate.js file:

// http://docs.jquery.com/Plugins/Validation/Methods/equalTo
equalTo: function (value, element, param) {
    // bind to the blur event of the target in order to revalidate whenever the target field is updated
    // TODO find a way to bind the event just once, avoiding the unbind-rebind overhead
    var target = $(param).unbind(".validate-equalTo").bind("blur.validate-equalTo", function () {
        $(element).valid();
    });

    if ($(target).is("input[type=hidden]") && $(target).attr("name") == "__RequestVerificationToken") {
        var otherElementId = $(element).attr("id");
        var underScoreIndex = otherElementId.indexOf("_");
        otherElementId = otherElementId.substring(0, underScoreIndex + 1);
        otherElementId += $(element).attr("data-val-equalto-other").substring(2);

        target = $("#" + otherElementId);
    }

    return value == target.val();
}

这劈，作为数据-VAL-equalto-其他属性的值，并用自己的ID混合它，找到正确的输入元素。会不会在所有情况下工作。但是，工作对我来说，在上述情况下。

This hack, takes the data-val-equalto-other attribute's value, and mixes it with its own ID, to find the correct input element. Won't work in all cases. But works for me, in the above case.

推荐答案

我发现，这是由于在jquery.validate.unobtrusive.js错误

I've found that this is due to an error in jquery.validate.unobtrusive.js

在不显眼的code补充说，试图通过它的name属性找到匹配的元素，使用下面的code的equalto适配器：

The code in Unobtrusive adds an equalto adapter that tries to find the matching element by its name attribute, using the following code:

element = $(options.form).find(":input[name=" + fullOtherName + "]")[0];

该fullOtherName变量通常是（也许永远）名称空间与时间，所以jQuery选择返回太多的投入，并选择最前面的一个。期间需要与.replace进行转义，给你（。\\\\）：

The fullOtherName variable is often (and probably always) namespaced with a period, so the jQuery selector returns too many inputs, and selects the very first one. The period needs to be escaped with .replace(".", "\\."), giving you:

element = $(options.form).find(":input[name=" + fullOtherName.replace(".", "\\.") + "]")[0];

一个类似的结构中存在的几行以下，也将需要被固定的（以及缩小的JavaScript）的

A similar construct exists a few lines lower, and will also need to be fixed (as well as the minified Javascript).

这篇关于JQuery的1.5休息比较验证（JQuery验证1.8）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！