How do I validate a form in MVC on button click?

Question

In my wizard I am using three buttons Next Previous and Finish like

<div class="wizard-footer">
            <div class="pull-right">
                <input type='button' class='btn btn-next btn-fill btn-success btn-wd btn-sm' name='next' value='Next' />
                <input type='submit' id='btnSubmit' class='btn btn-finish btn-fill btn-success btn-wd btn-sm' name='finish' value='Finish' />

            </div>
            <div class="pull-left">
                <input type='button' class='btn btn-previous btn-fill btn-default btn-wd btn-sm' name='previous' value='Previous' />
            </div>
            <div class="clearfix"></div>
        </div>

Next and Previous input type is button and Finish is submit type. So when I click on Submit all data annotation validation validate the form according to the validation rule I defined in Modes. Now I want to validate each step means when I click Next button all the Model validation should validate the form but when I click Previous validation should ignore.

Please help me on how to validate the form when Input type is Button in MVC. I google a lot but did not find any proper solution.

possible duplicate of How can I programmatically trigger client side validation set up by a Razor view? — CodeCaster
– CodeCaster, Commented Feb 24, 2015 at 11:31
Well that's the way to do it, and it doesn't show from your question that you tried that. If it didn't work, show all relevant code and explain what it did or didn't do. — CodeCaster
– CodeCaster, Commented Feb 24, 2015 at 11:35
on click of next button use $("#FormID").valid(), is this are you looking for? — Mox Shah
– Mox Shah, Commented Feb 24, 2015 at 11:36
If I understood your question properly, then you're looking for some script that can trigger your validations on client side when you click on next button, right? — Mox Shah
– Mox Shah, Commented Feb 24, 2015 at 11:39

Mox Shah · Accepted Answer · 2015-02-24 11:48:48Z

3

try bellow code,

$(".btn-next").click(function() {
    if ($("form").valid()) {
        //Some code to move on next tab
    } else {
        //Do something if form is InValid
        // Error messages will be auto populated, in case if you want some more furniture, use this block :)
    }
});

Demo

edited Feb 24, 2015 at 11:48

answered Feb 24, 2015 at 11:43

Mox Shah

3,0153 gold badges29 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

Namit Kumar Over a year ago

Let me check it. I need something like this only.

Namit Kumar Over a year ago

Actually this is validating the form but it's not showing any error message. I have done data annotation validation with this form. Is there any way those error message will display when validation failed ?

Mox Shah Over a year ago

Yes this way it will populate error message too, just check that fiddle

Mox Shah Over a year ago

I'm assuming client side validation is enabled in your page.

Namit Kumar Over a year ago

I have checked it but error is not displaying. It is only preventing the page to submit.

|

Collectives™ on Stack Overflow

How do I validate a form in MVC on button click?

1 Answer 1

8 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related