Open
Description
If multiple inputs depend on the value of one parent input, only the last of the dependants inputs gets its error styling / messaging removed if the parent input's value is changed.
For example:
<select id="foodType" name="foodType" data-validation="required" data-validation-error-msg="<strong>Food Type</strong> is required.">
<option value="">Please select...</option>
<option value="Pizza">Pizza</option>
<option value="Burger">Burger</option>
<option value="Curry">Curry</option>
<option value="Chips">Chips</option>
</select>
<!-- Dependent inputs: -->
<input id="topping1" name="topping1" type="text" data-validation="required" data-validation-depends-on="foodType" data-validation-depends-on-value="Pizza" data-validation-error-msg="<strong>Topping 1</strong> is required."/>
<input id="topping2" name="topping2" type="text" data-validation="required" data-validation-depends-on="foodType" data-validation-depends-on-value="Pizza" data-validation-error-msg="<strong>Topping 2</strong> is required."/>
<input id="topping3" name="topping3" type="text" data-validation="required" data-validation-depends-on="foodType" data-validation-depends-on-value="Pizza" data-validation-error-msg="<strong>Topping 3</strong> is required."/>
If "Pizza" is selected and the form then validated, topping1, topping2 & topping3 will become required and get the error class and message (correct).
If the foodtype select is changed to another option, only topping3 gets its error class and message removed (incorrect).
Please see this JSFiddle: https://jsfiddle.net/28tfq1dn/