Using built in ASP.NET MVC Validation with a wizard approach

杀马特。学长 韩版系。学妹 提交于 2019-12-12 19:23:38

问题


I am using the JQuery Steps Plugin basic form example for my Wizard.

In this example you will notice they are using JQuery Validate plugin which is the same plugin ASP.NET MVC uses automatically when submitting a form.

I am trying to figure out how to validate just the form fields in the current step when the user clicks continue, but using ASP.NET MVC syntax since I want my data-annotations to still work.

Here is what my ASP.NET MVC version of the basic form example looks like (Notice that I have asp-for and asp-validation-for set for everything):

<form asp-action="Wizard" id="example-form">
    <div>
        <div asp-validation-summary="ValidationSummary.ModelOnly" class="text-danger"></div>

        <h3>Basic Info</h3>
        <section>
            <div class="form-group">
                <label asp-for="Name" class="control-label"></label>
                <input asp-for="Name" class="form-control" />
                <span asp-validation-for="Name" class="text-danger" />
            </div>
        </section>
        <h3>Location</h3>
        <section>
            <div class="form-group">
                <label asp-for="City" class="control-label"></label>
                <input asp-for="City" class="form-control" />
                <span asp-validation-for="City" class="text-danger" />
            </div>
        </section>
        <h3>Contact Info</h3>
        <section>
            <div class="form-group">
                <label asp-for="ContactName" class="control-label"></label>
                <input asp-for="ContactName" class="form-control" />
                <span asp-validation-for="ContactName" class="text-danger" />
            </div>
        </section>
    </div>
</form>

For example, when the user clicks Next I would like the Name field to validate. When the user clicks next on step 2 I would like the City field to validate, and so on... I am so used to Submitting a single form all at once and allowing ASP.NET MVC to automatically validate for me, in this case I need to ask it to validate several different times before the actual submission.

Here is my JS:

var form = $("#example-form");
form.validate({
    errorPlacement: function errorPlacement(error, element) { element.before(error); },
    rules: {
        confirm: {
            equalTo: "#password"
        }
    }
});
form.children("div").steps({
    headerTag: "h3",
    bodyTag: "section",
    transitionEffect: "slideLeft",
    onStepChanging: function(event, currentIndex, newIndex) {
        form.validate().settings.ignore = ":disabled,:hidden";
        return form.valid();
    },
    onFinishing: function(event, currentIndex) {
        form.validate().settings.ignore = ":disabled";
        return form.valid();
    },
    onFinished: function(event, currentIndex) {
        //alert("Submitted!");
        form.submit();
    }
});

来源:https://stackoverflow.com/questions/35279785/using-built-in-asp-net-mvc-validation-with-a-wizard-approach

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!