2

我在我的 MVC3 项目中使用 Wizard-Step，现在是两个步骤，但我想在其中添加第三步。

但是，我仍然想在第二步中提交我的表单。这就是我的向导步骤 Jquery 代码的样子：

    $(function () {

        $(".wizard-step:first").fadeIn(); // show first step


        // attach backStep button handler
        // hide on first step
        $("#back-step").hide().click(function () {
            var $step = $(".wizard-step:visible"); // get current step
            if ($step.prev().hasClass("wizard-step")) { // is there any previous step?
                $step.hide().prev().fadeIn(4500);  // show it and hide current step

                // disable backstep button?
                if (!$step.prev().prev().hasClass("wizard-step")) {
                    $("#back-step").hide();
                }
            }
        });


        // attach nextStep button handler       
        $("#next-step").click(function () {

            var $step = $(".wizard-step:visible"); // get current step
            var validator = $("form").validate(); // obtain validator
            var anyError = false;
            $step.find("select").each(function () {
                if (!this.disabled && !validator.element(this)) { // validate every input element inside this step
                    anyError = true;
                }


            });
            $step.find("input").each(function () {
                if (!validator.element(this)) { // validate every input element inside this step
                    anyError = true;
                }


            });

            if (anyError)
                return false; // exit if any error found




            if ($step.next().hasClass("confirm")) { // is it confirmation?
                // show confirmation asynchronously
                $.post("/wizard/confirm", $("form").serialize(), function (r) {
                    // inject response in confirmation step
                    $(".wizard-step.confirm").html(r);
                });

            }

            if ($step.next().hasClass("wizard-step")) { // is there any next step?
                $step.hide().next().fadeIn(4500);  // show it and hide current step
                $("#back-step").show();   // recall to show backStep button
            }

            else { // this is last step, submit form
                 $("form").submit();
                 }

                return false;

            }


        });

    });

任何解决方案都受到高度赞赏。

4

1 回答 1

1

使用索引器变量，然后在第 2 步提交表单并在第 3 步发布结果

例如...我在此处发布我的一些项目代码以供参考...

    if (indexer < 2 && $step.next().hasClass("wizard-step")) {
        $step.hide().next().fadeIn();
        indexer++;
        ShowStep();
    }
    else {
        $.post(paths + "/Auction/Post", $('form').serialize(), function (data) {
            alert(data);
        })
        .complete(function () {
        });
    }
于 2012-04-05T09:56:37.283 回答