3

I have a form where I need to do additional processing when a single field validation has failed (when the user tabs out of the filed for instance, but the form has not been submitted) how can I hook up to this event with jquery-validate?

juhan_h
  • 3,965
  • 4
  • 29
  • 35

3 Answers3

3

To know if there has been an error in the form, use:

if(!$("#form0").valid()){
  //There was one or more errors in the form
}

To know if a specific element has an error, use:

if(!$("#form0").validate().element($("#text1"))){
  //There where some error in #text1
}

(Note that this two methods will also trigger validations)

Hope this helps. Cheers

Edgar Villegas Alvarado
  • 18,204
  • 2
  • 42
  • 61
  • I am aware of this. What I am trying to accomplish is to catch the moment when a single element is declared invalid. This happens before the whole form is validated. – juhan_h May 06 '11 at 06:47
2

I'm using a combination of overriding the highlight/unhighlight myself.

//Update the validator's highlight/unhighlight
$.validator.setDefaults({
  ignoreTitle:true
  ,highlight: function (element) {
    var el = $(element);
    //TODO: Handle UI changes, add/remove classes
    el.trigger("validate.fail");
  }
  ,unhighlight: function (element) {
    var el = $(element)
    //TODO: Handle UI changes, add/remove classes
    el.trigger("validate.success")
  }
});

Now, I can simply bind to the validate.fail method...

$("#myInputElement").bind("validate.fail",function(){
  //TODO: Do something with this knowledge.
});

NOTE: I have done this in the past to integrate jQuery with bootstrap's UI conventions... it's worked pretty well.

Tracker1
  • 19,103
  • 12
  • 80
  • 106
1

When you set up your validation, you should be saving the validator object. you can use this to validate individual fields.

<script type="text/javascript">
var _validator;
$(function () {
    _validator = $("#form").validate();   
});
function doSomething() {
    _validator.element($('#someElement'));
}
</script>
ShaneBlake
  • 11,056
  • 2
  • 26
  • 43
  • Still not what I am looking for (thanks for thinking with me though!). In your solution I would manually need to manually invoke validation. In my scenario the validation is already happening on a single input, I need to catch the result of the validation for that single input as soon as it happens. – juhan_h May 06 '11 at 07:27
  • Without seeing more of your code, I'm stabbing in the dark, but you might want to add a custom method. You could add whatever code you need too there... $.validator.addMethod("catchMe", function (value, element, arg) { /* do something now */ return false;}, "default error message..."); – ShaneBlake May 06 '11 at 14:20