1

I have a following form

<form name="addForm" method="POST" enctype="multipart/form-data" action="someurl" data-hasrequired="<?php echo __('* Required Fields') ?>" data-mage-init='{"validation":{}}'>
<select id="sel1" name="sel1" data-validate="true"></select>
<select id="sel2" name="sel2" data-validate="false"></select>
<button name="btn-ex" type="submit" title="<?php echo __('Submit') ?>" class="action submit primary">
                                    <span><?php echo __('Submit') ?></span>
                                </button>
</form>

I'm filling #sel1 and #sel2 using jquery with default selected to "blank". Now when user changes #sel1 then I want #sel2 to be required. When I change #sel2 attribute data-validate="true" and reload the page, it works, but I need that on change of #sel1. I wrote following jQuery on change method.

$('#sel1').change(function(){
                if($(this).val!="" || $(this).val!="0.00"){
                    jQuery('#sel2').attr('data-validate','{required:true}');
                }
                else{
                    jQuery('#sel2').attr('data-validate','{required:false}');
                }
            });

The jQuery code works and changes the attribute value of #sel2 but on click of Submit it doesn't validate.

0

you should create variable:

var dataForm = $('#form-validate');

window.FormValidate = dataForm.mage('validation');
$('#sel1').change(function(){
                if($(this).val!="" || $(this).val!="0.00"){
                    jQuery('#sel2').attr('data-validate','{required:true}');
                     window.FormValidate;
                }
                else{
                    jQuery('#sel2').attr('data-validate','{required:false}');
                    window.FormValidate;
                }
            });

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.