Use `$(el).val()` instead of `el.value` for compatibility with plugins that define custom `valHooks` #323

Closed
mathiasbynens opened this Issue Feb 24, 2012 · 5 comments

Comments

Projects
None yet
4 participants

Example use case: mathiasbynens/jquery-placeholder#29 (comment)

In my placeholder plugin, I patch val() through valHooks, so that it only returns the element’s value if the fake placeholder text is not being displayed at that point. That way, as long as you use .val(), you get the exact same behavior as you would in a browser that has a native placeholder implementation.

It would be awesome if your validation plugin would use $(el).val() instead of el.value, as it would improve compatibility with plugins like this that define custom valHooks.

Collaborator

jzaefferer commented Feb 24, 2012

Unfortunately a simple search-and-replace is not enough, just tried that. Would you be able to help out with a pull request?

I actually tried before posting this issue: http://paste.pocoo.org/raw/556623/

But got stuck after some unit tests failed (specifically test/index.html?filter=validator%3A%20form()%3A%20selects%3A%20min%2Frequired) and I didn’t immediately see why. Any idea what’s up?

Found a viable workaround here: http://stackoverflow.com/a/9022318/281067
Define addMethod:

jQuery.validator.addMethod("placeholder", function(value, element) {
  return value!=$(element).attr("placeholder");
}, jQuery.validator.messages.required);
$("form").validate({
  rules: {
    username: {required: true, placeholder: true},
  },
  message: {
    username: {
      required: "Username required", placeholder: "Username required",
    },
  }
});

@fschroiff Cool, sounds like an idea!

However, it is possible that the user enters the placeholder text as input value, in which case the jQuery Validate plugin should still use the actual value.

For my specific plugin, it could be fixed using something like… (untested)

jQuery.validator.addMethod('placeholder', function(value, element) {
  return !$(element).hasClass('placeholder');
}, jQuery.validator.messages.required);
Contributor

mlynch commented Mar 28, 2012

Duplicate of #44

mlynch closed this Apr 19, 2012

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment