How to do a password confirmation match?

[aziz]

Is there a way to see whether password confirmation matched password or not, using h5Validate?

[ericelliott]

Sure. Using JavaScript, set the 2nd password field's pattern attribute to the value of the first password input.

[aziz]

thanks

[mrmartineau]

I would like to do this for an email field? Can this be done since the plugin already adds a pattern attr and fills it with the email validation regex?

[ericelliott]

Sure, just replace the second email's regex with the first email (make sure the first email is a valid email, first!)

[evadne]

Sorry, the advice from @dilvie regarding patterns is now incorrect. This breaks if the input string contains special characters in regular expressions e.g. [ ] / and most importantly . which matches any character. The proper solution is to escape the string first for safe matching using an approach practiced in jQuery UI, $.ui.autocomplete.escapeRegex:

var escapeRegex = function (value) {
  // Stolen from $.ui.autocomplete.escapeRegex
  return value.replace(/[\-\[\]{}()*+?.,\\\^$|#\s]/g, "\\$&");
};

Another item that has seldom been discussed is the dynamic and on-demand invocation on input change where the pattern is updated, and the validation re-run on every change. This provides immediate feedback.

This snippet works for our product. It is for validating passwords, not email addresses, but the workflow is the same nevertheless:

$form.on("keyup blur change", ".set-user-password :password", function () {
  var $this = $(this);
  var $allPasswordFields = $this.closest(".set-user-password").find(":password");
  var escapeRegex = function (value) {
    // Stolen from $.ui.autocomplete.escapeRegex
    return value.replace(/[\-\[\]{}()*+?.,\\\^$|#\s]/g, "\\$&");
  };
  if ($allPasswordFields.length == 2) {
    if ($this.is($allPasswordFields.eq(0))) {
      var $next = $allPasswordFields.eq(1);
      $next.attr("pattern", escapeRegex($this.val()));
      if ($next.val().length) {
        $next.h5Validate("isValid");
      }
    }
  }
});

[ericelliott]

Or don't validate the second email with h5Validate. Instead, run an === check against the first email.

[evadne]

Maybe we can add a matching type for string equality but keep it within existing structure?

On Mar 29, 2014, at 13:01, Eric Elliott notifications@github.com wrote:

Or don't validate the second email with h5Validate. Instead, run an ===check against the first email.

Reply to this email directly or view it on GitHubhttps://github.com/dilvie/h5Validate/issues/17#issuecomment-38987114 .

[ericelliott]

I could get on board with that, as long as it was added in a modular fashion. There is an outstanding PR that introduces some modularity in the validation types. This is something I've wanted to see in h5Validate for a long time.