Parsley.js destory and revalidate fields already validated -

Parsley.js destory and revalidate fields already validated -

i have implemented parsley on complicated form uses on-blur validation.

i have run issue go through form, fields validated 1 one, based on dropdown change, have destory parlsey object in order modify validation , fields valid no longer valid.

how can retain validated fields.

for illustration have following:

<input type="text" id="1"> <input type="text" id="2"> <select id="select"> <option id=1>1</option> <option id=2>2</option> <option id=3>3</option> </select> <input type="text" id="3"> <input type="text" id="4"> <input type="text" id="5"> scenario: i come in info in id=1 , id=2 textboxes, success class added tab out of textbox. i alter select box alternative 2 i destroy parsley success class removed id=1 , id=2 textboxes

currently doing following:

$("#form").parsley().destroy(); $('#form').parsley({ successclass: "valid", errorclass: "invalid", errorswrapper: '<div></div>', errortemplate: '<p></p>' }).validate('section'); what does this revalidates fields what looking for i need id=1 , id=2 remain valid after destroy.

when phone call destroy() things parsley destroyed. means classes, messages (dom), objects , events destroyed.

if you're looking way maintain ui aspect, can not-so-pretty solution:

in styles, have .valid { ...} add together class: .valid, .fake-valid { ... }. same invalid. before calling destroy(), navigate through fields , check if there class valid or invalid if so, apply class called fake-valid or fake-invalid. using event parsley:form:init, loop through fields 1 time again , alter classes fake-... right classes.

parsley validate fields ui maintained.

check jsfiddle.

class="lang-html prettyprint-override"><style> .valid, .fake-valid { color: #468847; background-color: #dff0d8; border: 1px solid #d6e9c6; } .invalid, .fake-invalid { color: #b94a48; background-color: #f2dede; border: 1px solid #eed3d7; } </style> <form id="myform" method="post"> <input type="text" id="1" data-parsley-trigger="focusout" required /> <input type="text" id="2" data-parsley-trigger="focusout" required /> <select id="select"> <option id=1>1</option> <option id=2>2</option> <option id=3>3</option> </select> </form> <script> $(document).ready(function() { var parsleyopts = { successclass: "valid", errorclass: "invalid", errorswrapper: '<div></div>', errortemplate: '<p></p>' }; var parsleyform = $("#myform").parsley(parsleyopts); $("#select").on('change', function() { // before destroy, add together false class (var in parsleyform.fields) { var elem = parsleyform.fields[i].$element; if (elem.hasclass('valid')) elem.addclass('fake-valid'); else if(elem.hasclass('invalid')) elem.addclass('fake-invalid'); } parsleyform.destroy(); parsleyform = $("#myform").parsley(parsleyopts); }); // when parlsey initialized, lets see if fields have false classes // if so, add together parsley classes $.listen('parsley:form:init', function(forminstance) { (var in forminstance.fields) { var elem = forminstance.fields[i].$element; if (elem.hasclass('fake-valid')) elem.toggleclass('fake-valid valid') if (elem.hasclass('fake-invalid')) elem.toggleclass('fake-invalid invalid'); } }); }); </script>

parsley.js