Manually validate textbox with jQuery unobtrusive validation asp.net MVC3

问题

So I have a multi-step process that allows a user to retrieve a forgotten password. The steps are like so, with a different action for each step in my controller:

Enter username and email
Enter password question answer
Email a recovery link to the user if all goes well

I tried using one model for everything:

public class AccountForgotPassword
{

    [Required()]
    [DisplayName("Username")]
    public string UserName { get; set; }

    [Required()]
    public string Email { get; set; }

    [Required()]
    public string PasswordAnswer { get; set; }

}

But when I check ModelState.IsValid on the first action, since the user can't input their password answer question yet, it will always be false and makes for some interesting code to check that the model state is in fact valid but is only missing the password answer since I don't know who the user is yet.

To get around this, I decided to forgo a typed model and just use string parameters in my actions. Only problem now is that I can no longer use the easy validation wire-ups you get with model binding.

With that said, does anyone know an easy way to manually wire-up the jQuery validation to individual inputs so it will check the required rule? Also, will this wiring allow me to use the default error messages the validator generates, or will I have to supply my own upon wiring them up? Would it be this easy in my view:

@{
    ViewBag.Title = "Forgot Password";
}
<h2>
    Forgot Password</h2>
@using (Html.BeginForm())
{ 
    <p>
        @Html.Label("UserName", "Username")
        @Html.TextBox("UserName")
        @Html.ValidationMessage("UserName")
    </p>

    <p>
        @Html.Label("Email", "Email")
        @Html.TextBox("Email")
        @Html.ValidationMessage("Email")
    </p>

    <p>
        <input type="submit" value="Send Form" />
    </p>
}

<script type="text/javascript">
    $.validator.unobtrusive.addRule(..something here...);
</script>

Also if there is a better way to do this, please let me know.

UPDATE

For anyone else that finds this, I did figure out how to add the rules manually. Should have just read the validation docs first. Assuming the view html above, the script would be:

<script type="text/javascript">
    $(function () {
        $('#UserName').rules('add', {
            required: true,
            messages: {
                required: 'The username field is required.'
            }
        });

        $('#Email').rules('add', {
            required: true,
            messages: {
                required: 'The email field is required.'
            }
        });

        $.validator.unobtrusive.parse('form');
    });
</script>

However, after thinking about it some more and taking AFinkelstein's answer into account, I think I will just go ahead and make 2 different view models and let the framework do the work for me.

回答1:

If you validate just the username and password first, and then the Password answer second, I think the easiest solution is to have two separate View Models. Then you can still use the appropriate View Model and validation for each section.

来源：https://stackoverflow.com/questions/10353453/manually-validate-textbox-with-jquery-unobtrusive-validation-asp-net-mvc3

标签

asp.net-mvc-3

jquery-validate

unobtrusive-validation