Compare (password) attribute

Kras picture Kras · Jul 25, 2011 · Viewed 22.3k times · Source

I'd like to create a view model for a new user using the code below. The "User" class contains just the two properties (simplified for now) that I will persist to the database; the view model adds a "compare password" field, which is only used in the view. I'd prefer to have the view model use the "User" class directly, rather than repeating all of the fields defined in "User".

My question is how do I properly reference "User.Password" in the [Compare] attribute for the "ComparePassword" field?

public class User
{
   [Required]
   public string UserName { get; set; }

   [Required]
   [DisplayName("Password")]
   [DataType(DataType.Password)]
   public string Password { get; set; }
}
public class NewUserViewModel
{
    public User User { get; set; }

    [Required]
    [DataType(DataType.Password)]
    [DisplayName("Re-enter Password")]
    [Compare("Password", ErrorMessage="Passwords must match")]
    public string ComparePassword { get; set; }
}

The HTML that gets generated for "Password" and "ComparePassword" is below.

<input class="text-box single-line password" 
  data-val="true" 
  data-val-required="The Password field is required." 
  id="User_Password" 
  name="User.Password" 
  type="password" value="" />

<input class="text-box single-line password" 
  data-val="true" 
  data-val-equalto="Passwords must match" 
  data-val-equalto-other="*.Password"
  data-val-required="The Re-enter Password field is required." 
  id="ComparePassword" 
  name="ComparePassword" 
  type="password" value="" />

The key is how the "data-val-equalto-other" is handled by the Javascript. If I use "Password" or "User_Password" nothing happens - no check is performed. If I use "User.Password" the check is performed but always fails.

I have no real problem doing this directly in jQuery, but would prefer to use the [Compare] attribute if at all possible.

Answer

Peter picture Peter · Jul 29, 2011

Just found the answer via StackOverflow and Microsoft Connect:

See:

http://connect.microsoft.com/VisualStudio/feedback/details/665793/jquery-unobtrusive-validate-equalto-fails-with-compare-attribute and JQuery 1.5 breaks Compare Validate (JQuery Validate 1.8)

To summerize, it looks like a bug in the jquery.validate.unobtrusive file that came with MVC3. The workaround is changing the following line in the jquery.validate.unobtrusive file.

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

to

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

On Microsoft Connect, it says MS has fixed it, but i couldnt find the link to the new version. Anyways, this works for me in the meantime. Hope it helps