1

I'm using jquery-validate to validate a form. Jquery-validate works well and doesn't send form if a required field is empty. But if my form is into an jquery-ui accordion, the form is sent.

Rules:

$("#form_master").validate({
    rules: {
        categorie: "required"
    }});`

Accordion: 

$("#accordion").accordion({ autoHeight: true, navigation: true, });

You can try it here : http://jsfiddle.net/Zv76Y/4/

Thank you in advance for your answer.

marc_s
  • 732,580
  • 175
  • 1,330
  • 1,459
Antrax
  • 13
  • 1
  • 6
  • Possible duplicate of [jquery validation not working on an accordion](http://stackoverflow.com/questions/13878476/jquery-validation-not-working-on-an-accordion) – Ulad Kasach Apr 26 '16 at 22:39

1 Answers1

1

It is because, the validator by default ignores hidden elements.

So when you use an accordion the input fields are hidden so they are not validated

$("#form_master").validate({
    ignore: [],
    rules: {
        categorie: "required"
    },
    errorPlacement: function (error, element) {
        if (element.is(":radio")) error.appendTo(element.parent().next().next());
    }
});

Demo: Fiddle

Note: You may have to highlight the accordion tags with error so that users will now that there is error

Arun P Johny
  • 384,651
  • 66
  • 527
  • 531
  • @Antrax and Arun, as per the developer, the proper way to disable this behavior is `ignore: []` ~ See: http://stackoverflow.com/a/8565769/594235 – Sparky Mar 19 '14 at 15:08