Parsley JS 2.x - disable validation for fields that are not visible

Question

I want Parsley not to check input if it is not displayed. I have a large multi-step survey that shows new sections as they are completed. Each section has its own tag, and in each form I can have several sections that show when you go through it. I am currently using 1.x, and here is how I am doing it now:

$('#' + formID).parsley({ errors : { container: function(element) { var $container = element.parent().find('parsley-container'); if($container.length === 0) { if($(element).hasClass('text-hide') && !$(element).hasClass('not-select')) { $(element).prev().addClass('is-error'); } else { $container = $('<div class="parsley-container"></div>').insertAfter(element); } } return $container; } }, listeners: { onFieldValidate: function(elem) { if(!$(elem).is(':visible')) { return true; } return false; } } 

In the listeners section, I check only the visible fields. How can I do this in Parsley 2.x? I am looking through the documentation and I cannot find an equivalent way to do this. I know that in group 2.x there are validation groups, but is there a way to do this, as I did in 1.x?

Answer 1

The simplest solution is to exclude all hidden inputs, for example:

 $('#' + formID).parsley({ excluded: "input[type=button], input[type=submit], input[type=reset], input[type=hidden], input:hidden" }); 

Thus, the check will only link visible inputs. However, this forces you to destroy and apply Parsley every time the entrance changes visibility.

To avoid this, you can use the following "not very elegant" solution. This code would be better in the "parsley: field: validate" event, but I couldn't get it to work.

Using the "parsley: validated" field, the check has already been completed, and now we will change the check result to true and hide the error container.

 $('#' + formID).parsley(); $.listen('parsley:field:validated', function(fieldInstance){ if (fieldInstance.$element.is(":hidden")) { // hide the message wrapper fieldInstance._ui.$errorsWrapper.css('display', 'none'); // set validation result to true fieldInstance.validationResult = true; return true; } }); 

---

As in Parsley 2.1. * parsley:field:validated event throws the following message

The pubsub parsley module is deprecated; use the appropriate jQuery event method instead

Instead of parsley:field:validated you should use the field:validated event

---

In recent versions, $.listen() deprecated. You should use Parsley.on() . Example:

 Parsley.on('field:validated', function(fieldInstance){ if (fieldInstance.$element.is(":hidden")) { // hide the message wrapper fieldInstance._ui.$errorsWrapper.css('display', 'none'); // set validation result to true fieldInstance.validationResult = true; return true; } });