I am using jQuery steps ( https://github.com/rstaib/jquery-steps/wiki ) in order to create step by step form to users to fill out. It works great, however I need to be able to r
You can paste this:
$.fn.steps.reset = function () {
var wizard = this,
options = getOptions(this),
state = getState(this);
goToStep(wizard, options, state, 0);
for (i = 1; i < state.stepCount; i++) {
var stepAnchor = getStepAnchor(wizard, i);
stepAnchor.parent().removeClass("done")._enableAria(false);
}
};
in the jquery.steps.js file right after this code:
$.fn.steps = function (method)
{
if ($.fn.steps[method])
{
return $.fn.steps[method].apply(this, Array.prototype.slice.call(arguments, 1));
}
else if (typeof method === "object" || !method)
{
return initialize.apply(this, arguments);
}
else
{
$.error("Method " + method + " does not exist on jQuery.steps");
}
};
and call it like this wherever you want:
$('myjquerystepmodal').steps("reset");
a small correction with the custom reset function :
$.fn.steps.reset = function () {
var wizard = this,
options = getOptions(this),
state = getState(this);
if(state.currentIndex>0)
{
goToStep(wizard, options, state, 0);
for (i = 1; i < state.stepCount; i++) {
var stepAnchor = getStepAnchor(wizard, i);
stepAnchor.parent().removeClass("done")._enableAria(false);
}
}
};
I added a if, in case you try to reset at step 0.
You can user this function after submitting your form:
function resetForm(id_form){
$("#" + id_form).find('input[type="text"]').val('');
$("#" + id_form).find('input[type="password"]').val('');
$("#" + id_form).find('input[type="checkbox"]').removeAttr("checked");
$("#" + id_form).find('select option').removeAttr("selected");
$("#" + id_form).find('textarea').val('');
}
Best regards!
I was able to reset my jQuery steps wizard by adding a few lines of code to the solution here, plus a couple extra lines of code to remove the css classes. You'll still need to reset your form using your preferred library before or after calling this function.
$.fn.steps.reset = function () {
var wizard = this,
options = getOptions(this),
state = getState(this);
goToStep(wizard, options, state, 0);
for (i = 1; i < state.stepCount; i++) {
var stepAnchor = getStepAnchor(wizard, i);
stepAnchor.parent().removeClass("done")._enableAria(false);
}
};
You can use jQuery Form Plugin , Resetting or clearing your form is then very Easy
$('#myFormId').resetForm();
Or
$('#myFormId').clearForm();
Or only Special Fields
$('#myFormId .specialFields').clearFields();