CODEWITHSUNDEEP
jqueryvalidationjquery-ui-accordion
WebDevB
WebDevB

Reputation: 492

Jquery Validation, open accordion

We are using jQuery Accordion & Validation on tha same page... There are 3 accordions within the form.

The validation works perfectly but what I want to do is if 1 of the fields is in-valid I want the accordion to open on the in-valid field.

I'm trying to do it on the InvalidHandler but can't get it to open, I've tried using the following:

invalidHandler: function(event, validator, element) {

  $('#form1').find('error.error-message').parents('fieldset').next().show();

},

Has anyone managed to do this?

Thanks.

Upvotes: 0

Views: 2397

Answers (4)

Ashish Kumar 2
Ashish Kumar 2

Reputation: 1

Suppose we have accordion and its inner divs. Then suppose inner div's have multiple required field validators controls. That has text like 'Please this field is required' .

Then we find that required validator and match the inner text has 'Please' then find the closet accordion div index. and set to index to display first. below $('[id*=MasterCard]') find id that has inner text like 'MasterCard'

///managing the display of accordion tab has validation failure               


  $('[id*=MasterCard]').each(function () {
      var reqID = this.style.display;
      if (reqID == 'inline' && this.innerText.indexOf('Please') > -1) {
          var index = $(this).closest(".ui-accordion-content")
                             .index(".ui-accordion-content");
          $("#accordion").accordion({
              active: index
          });
      }
  });

Upvotes: 0

WebDevB
WebDevB

Reputation: 492

Managed to get this working guys.

I've just removed one of the .parents() from the code, so it now looks like this:

$('#form1').find('.error.error-message').parents().show();

Thanks.

Upvotes: 1

Abhineet
Abhineet

Reputation: 632

If you are using jQuery UI Accordion and "error" is class name than try the code below.

$('#form1').find('.error.error-message').parent().parent().next().next().show();

Upvotes: 0

Prashobh
Prashobh

Reputation: 9542

if it is a class add . 

$('#form1').find('error.error-message').parents('fieldset').next().show();

to

$('#form1').find('.error.error-message').parents('.fieldset').next().show();

Upvotes: 0

Related Questions