I am using http://jqueryvalidation.org/ and have the following working fine
<button type="submit" name="submit" value="complete" class="btn green"><i class="fa fa-check"></i> Complete Section</button>
<button type="submit" name="submit" value="save" class="btn green"><i class="fa fa-save"></i> Save</button>
and
var form1 = $('#form_sample_1');
var error1 = $('.alert-danger', form1);
var success1 = $('.alert-success', form1);
form1.validate({
errorElement: 'span', //default input error message container
errorClass: 'help-block help-block-error', // default input error message class
focusInvalid: false, // do not focus the last invalid input
ignore: "", // validate all fields including form hidden input
invalidHandler: function (event, validator) { //display error alert on form submit
success1.hide();
error1.show();
Metronic.scrollTo(error1, -200);
},
highlight: function (element) { // hightlight error inputs
$(element)
.closest('.form-group').addClass('has-error'); // set error class to the control group
},
unhighlight: function (element) { // revert the change done by hightlight
$(element)
.closest('.form-group').removeClass('has-error'); // set error class to the control group
},
success: function (label) {
label
.closest('.form-group').removeClass('has-error'); // set success class to the control group
},
submitHandler: function (form) {
form.submit();
}
});
However, what I would ideally like is if the "SAVE" button is pressed, for the form to be submitted and not validated i.e. only validated when the "COMPLETE" button is pressed.