/*========================================================================================= File Name: wizard-steps.js Description: wizard steps page specific js ---------------------------------------------------------------------------------------- Item name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template Author: PIXINVENT Author URL: http://www.themeforest.net/user/pixinvent ==========================================================================================*/ // Wizard tabs with numbers setup $(".number-tab-steps").steps({ headerTag: "h6", bodyTag: "fieldset", transitionEffect: "fade", titleTemplate: '#index# #title#', labels: { finish: 'Submit' }, onFinished: function (event, currentIndex) { alert("Form submitted."); } }); // Wizard tabs with icons setup $(".icons-tab-steps").steps({ headerTag: "h6", bodyTag: "fieldset", transitionEffect: "fade", titleTemplate: '#index# #title#', labels: { finish: 'Submit' }, onFinished: function (event, currentIndex) { alert("Form submitted."); } }); // Validate steps wizard // Show form var form = $(".steps-validation").show(); $(".steps-validation").steps({ headerTag: "h6", bodyTag: "fieldset", transitionEffect: "fade", titleTemplate: '#index# #title#', labels: { finish: 'Submit' }, onStepChanging: function (event, currentIndex, newIndex) { // Allways allow previous action even if the current form is not valid! if (currentIndex > newIndex) { return true; } // Needed in some cases if the user went back (clean up) if (currentIndex < newIndex) { // To remove error styles form.find(".body:eq(" + newIndex + ") label.error").remove(); form.find(".body:eq(" + newIndex + ") .error").removeClass("error"); } form.validate().settings.ignore = ":disabled,:hidden"; return form.valid(); }, onFinishing: function (event, currentIndex) { form.validate().settings.ignore = ":disabled"; return form.valid(); }, onFinished: function (event, currentIndex) { alert("Submitted!"); } }); // Initialize validation $(".steps-validation").validate({ ignore: 'input[type=hidden]', // ignore hidden fields errorClass: 'danger', successClass: 'success', highlight: function (element, errorClass) { $(element).removeClass(errorClass); }, unhighlight: function (element, errorClass) { $(element).removeClass(errorClass); }, errorPlacement: function (error, element) { error.insertAfter(element); }, rules: { email: { email: true } } });