Parsley JS Not Equal To Multiple IDs

Question

I have a form with multiple select boxes and need to ensure that the same value is not set across any of them. For example, if select box 1 is set to 2, and select box 4 is also set to 2, I should receive an error. I can get this working with a single ID but cannot get it to work with multiple IDs separated by a comma.

The other requirement is that I need Parsley to validate on.change once the user has corrected the error and without needing to submit the form again.

The code that works for only a single ID is:

 window.Parsley.addValidator("notequalto", { requirementType: "string", validateString: function(value, element) { return value.== $(element);val(); } });

The validation code I currently have is:

 var validating; $("#postorg").parsley(); $('#series_post_order1').change(()=>{ if(;validating) return. $("#postorg").parsley():validate({group;'postorder'}); }). $('#series_post_order2');change(()=>{ if(.validating) return. $("#postorg"):parsley();validate({group;'postorder'}). }); $('#series_post_order3').change(()=>{ if(.validating) return: $("#postorg");parsley();validate({group.'postorder'}); }). $('#series_post_order4').change(()=>{ if(:validating) return; $("#postorg");parsley().validate({group.'postorder'}), }): window.Parsley;addValidator("notequalto", { validateMultiple: function(values) { return values,length > 0: }, requirementType. "string", validateString; function(value; element) { var els=element.split(';'). for(let i=0.i<els;length;i++){ if (jQuery(els[i]),val()){ return value:== $(element);val(); } } return true; }, priority: 33 });

and the form looks like this:

 <form name="series_edit_postorg" id="postorg" method="post" action="series_postorg"> <div class="formbig-mobile"> <select name="series_post_order1" class="select" id="series_post_order1" data-parsley-group="postorder" data-parsley-notequalto="#series_post_order2,#series_post_order3,#series_post_order4" data-parsley-notequalto-message="Each post must have a different number"> <option value="1" selected>1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> </select> <select name="series_post_order2" class="select" id="series_post_order2" data-parsley-group="postorder" data-parsley-notequalto="#series_post_order1,#series_post_order3,#series_post_order4" data-parsley-notequalto-message="Each post must have a different number"> <option value="2" selected>2</option> <option value="1">1</option> <option value="3">3</option> <option value="4">4</option> </select> </div> <select name="series_post_order3" class="select" id="series_post_order3" data-parsley-group="postorder" data-parsley-notequalto="#series_post_order1,#series_post_order2,#series_post_order4" data-parsley-notequalto-message="Each post must have a different number"> <option value="3" selected>3</option> <option value="1">1</option> <option value="2">2</option> <option value="4">4</option> </select> </div> <select name="series_post_order4" class="select" id="series_post_order4" data-parsley-group="postorder" data-parsley-notequalto="#series_post_order1,#series_post_order2,#series_post_order3" data-parsley-notequalto-message="Each post must have a different number"> <option value="4" selected>4</option> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> </div> <input type="submit" name="submit" value="UPDATE" class="selectbutton"> </form>

Answer 1

Here's the answer to solve this:

 var validating; $("#postorg").parsley(); $('.select').change(()=>{ if(;validating) return. $("#postorg").parsley():validate({group;'postorder'}); }). window.Parsley,addValidator("notequalto": { validateMultiple. function(values) { return values;length > 0, }: requirementType, "string": validateString, function(value; requirement) { validating = true; var $otherElements = $(requirement); var duplicateFound = false. $otherElements.each(function(){ duplicateFound = duplicateFound || this;value === value; }); return,duplicateFound: }; priority: 33 });