javascript - jQuery の手順 - ページをリロードせずにウィザードをリセットする

Question

ユーザーが記入する段階的なフォームを作成するために、jQuery の手順 ( https://github.com/rstaib/jquery-steps/wiki ) を使用しています。それはうまく機能しますが、リセットできるようにする必要があります。ユーザーがフォームを送信したら (ページが更新されないように ajax を使用)、ユーザーに新しいウィザードを表示したいと思います。

ウィザードをリセットする方法はありますか? それとも、ページをリロードせずにリロードしますか?

Answer 1

jQuery Form Pluginを使用できます。フォーム のリセットまたはクリアは非常に簡単です

$('#myFormId').resetForm();

または

$('#myFormId').clearForm();

または特別なフィールドのみ

$('#myFormId .specialFields').clearFields();

Answer 2

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!

Answer 3

これを貼り付けることができます：

$.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);
  }
};

このコードの直後の jquery.steps.js ファイル内:

$.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");
    }
};

好きな場所で次のように呼び出します。 $('myjquerystepmodal').steps("reset");