/* ------------------------------------------------------------------------------
*
* # Stepy wizard
*
* Specific JS code additions for wizard_stepy.html page
*
* Version: 1.1
* Latest update: Dec 25, 2015
*
* ---------------------------------------------------------------------------- */
$(function() {
// Override defaults
$.fn.stepy.defaults.legend = false;
$.fn.stepy.defaults.transition = 'fade';
$.fn.stepy.defaults.duration = 150;
$.fn.stepy.defaults.backLabel = ' Back';
$.fn.stepy.defaults.nextLabel = 'Next ';
// Wizard examples
// ------------------------------
// Basic wizard setup
$(".stepy-basic").stepy();
// Hide step description
$(".stepy-no-description").stepy({
description: false
});
// Clickable titles
$(".stepy-clickable").stepy({
titleClick: true
});
// Stepy callbacks
$(".stepy-callbacks").stepy({
next: function(index) {
alert('Going to step: ' + index);
},
back: function(index) {
alert('Returning to step: ' + index);
},
finish: function() {
alert('Submit canceled.');
return false;
}
});
//
// Validation
//
// Initialize wizard
$(".stepy-validation").stepy({
validate: true,
block: true,
next: function(index) {
if (!$(".stepy-validation").validate(validate)) {
return false
}
}
});
// Initialize validation
var validate = {
ignore: 'input[type=hidden], .select2-search__field', // ignore hidden fields
errorClass: 'validation-error-label',
successClass: 'validation-valid-label',
highlight: function(element, errorClass) {
$(element).removeClass(errorClass);
},
unhighlight: function(element, errorClass) {
$(element).removeClass(errorClass);
},
// Different components require proper error label placement
errorPlacement: function(error, element) {
// Styled checkboxes, radios, bootstrap switch
if (element.parents('div').hasClass("checker") || element.parents('div').hasClass("choice") || element.parent().hasClass('bootstrap-switch-container') ) {
if(element.parents('label').hasClass('checkbox-inline') || element.parents('label').hasClass('radio-inline')) {
error.appendTo( element.parent().parent().parent().parent() );
}
else {
error.appendTo( element.parent().parent().parent().parent().parent() );
}
}
// Unstyled checkboxes, radios
else if (element.parents('div').hasClass('checkbox') || element.parents('div').hasClass('radio')) {
error.appendTo( element.parent().parent().parent() );
}
// Input with icons and Select2
else if (element.parents('div').hasClass('has-feedback') || element.hasClass('select2-hidden-accessible')) {
error.appendTo( element.parent() );
}
// Inline checkboxes, radios
else if (element.parents('label').hasClass('checkbox-inline') || element.parents('label').hasClass('radio-inline')) {
error.appendTo( element.parent().parent() );
}
// Input group, styled file input
else if (element.parent().hasClass('uploader') || element.parents().hasClass('input-group')) {
error.appendTo( element.parent().parent() );
}
else {
error.insertAfter(element);
}
},
rules: {
email: {
email: true
}
}
}
// Initialize plugins
// ------------------------------
// Apply "Back" and "Next" button styling
$('.stepy-step').find('.button-next').addClass('btn btn-primary');
$('.stepy-step').find('.button-back').addClass('btn btn-default');
// Select2 selects
$('.select').select2();
// Simple select without search
$('.select-simple').select2({
minimumResultsForSearch: Infinity
});
// Styled checkboxes and radios
$('.styled').uniform({
radioClass: 'choice'
});
// Styled file input
$('.file-styled').uniform({
fileButtonClass: 'action btn bg-blue'
});
});