0

我在 MVC 应用程序中使用 Jquery Form 向导插件。http://thecodemine.org/ 我有一个包含 4 个步骤的表格。在其中一个步骤中，我具有上传功能。我希望在每个步骤以及返回和下一步都提交功能。后面的步骤是可选的。

我能够在导航中添加提交按钮。点击后，仅提交与活动步骤相关的表单数据，其他数据为空。

为了更清楚我的问题：查看：

<form id="myform" method="post" action="/Controller/Action">
    <div id="fieldWrapper">
        <fieldset class="step fieldset" id="first">
            <legend class="legend">First step</legend>
            Some input controls
        </fieldset>
        <fieldset class="step fieldset" id="second">
            <legend class="legend">Second step</legend>
            some more input controls (optional)
        </fieldset>
        <fieldset class="step fieldset" id="third">
            <legend class="legend">Third step</legend>
            some more input controls with filu upload
            (optional)
        </fieldset>
        <fieldset class="step fieldset" id="fourth">
            <legend class="legend">Fourth step</legend>
            some more input controls (optional)
        </fieldset>
    </div>
    <div id="demoNavigation">
        <input class="navigation_button" id="back" value="Back" type="reset" />
        <button type="submit" id="submitBtn">Submit and Finish</button>
        <input class="navigation_button" id="next" value="Next" type="submit" />
    </div>
    </form>

脚本：

<script type="text/javascript">
    $(function () {
        $("#myform").formwizard({
            validationEnabled: true,
            focusFirstInput: false,
            disableUIStyles: true,
            textSubmit: 'Submit and Finish',
            textNext: 'Continue to next step',
            next: "input:submit"
        }
        );
    });
</script>

更新了 Jquery.form.wizard.js 以使提交按钮在最后一步隐藏。现在每一步我都有提交按钮和导航按钮。

当我在第二步提交表单时，第二步中的表单数据只发布，其余的不发布。

我浏览了样品，但找不到合适的样品。谁能建议如何实现这一目标？

4

1 回答 1

1

我浏览了文档和 jquery.form.wizard.js 文件，以更深入地了解所做的工作。

我只需要编写一些脚本如下：

<script type="text/javascript">
    $(function () {
        $("#myform").formwizard({
            validationEnabled: true,
            focusFirstInput: false,
            disableUIStyles: true,
            textSubmit: 'Submit and Finish',
            textNext: 'Continue to next step',
            next: "input:submit"
        }
        );
    });
    $('#submitBtn').click(function () {
        var stepInfo = $('#myform').formwizard('state');
        for (var i = 0; i < stepInfo.activatedSteps.length; i++) {
            stepInfo.steps.filter("#" + stepInfo.activatedSteps[i]).find(":input").not(".wizard-ignore").removeAttr("disabled");
        }
    });
</script>
于 2013-01-04T09:52:47.827 回答