Prevent form from submitting when using unobtrusive validation in ASP.NET MVC 3

问题

I am trying to implement remote validation using ASP.NET MVC3 unobtrusive javascript.

It seems to work, but I am able to submit my form even if it is not supposed to be valid.

It looks like the validation is not happening fast enough. I am using the ASP.NET development server with the VS 2010 debugger and the remote validation method is not always fired. When I wait a little, the validation happens and I cannot submit the form.

I am starting to think that client-side remote validation is not reliable enough and I maybe should consider using server-side validation just to be sure the correct validations are applied.

Is there a way to fix this?

EDIT:

Like you asked, here are the part of my code relative to the problem. I will start by taking your advice and use server-side validation to avoid users bypassing my validations.

Model:

[Required(ErrorMessage = "*"), StringLength(50)]
[Remote("EventCategoryNameExists", "EventCategories",
    AdditionalFields = "EventCategoryId",
    ErrorMessageResourceType = typeof(Messages),
    ErrorMessageResourceName = "EventCategoryNameAlreadyExists")]
[LocalizedDisplayName("Name")]
public string Name { get; set; }

View:

<div id="formMain">

    @Html.HiddenFor(x => x.EventCategoryId)

    <fieldset class="formFieldset">
        <legend>@Labels.EventCategoryDetails</legend>
        <div class="formFieldsetContent">
            <table id="formTable" class="formTable">
                <tr>
                    <td class="formLabelCell" style="width: 90px;">
                        @Html.LabelFor(x => x.Name)&nbsp;:&nbsp;
                    </td>
                    <td class="formInputCell">
                        @Html.EditorFor(x => x.Name)
                        @Html.ValidationMessageFor(x => x.Name)
                    </td>
                </tr>
                <tr>
                    <td class="formLabelCell" style="vertical-align: top;">
                        @Html.LabelFor(x => x.Color)&nbsp;:&nbsp;
                    </td>
                    <td class="formInputCell">
                        @Html.EditorFor(x => x.Color)
                        @Html.ValidationMessageFor(x => x.Color)
                    </td>
                </tr>
            </table>
        </div>
    </fieldset>
</div>

<div class="formButtons">                      
    <input type="submit" id="btnSave" value="@Labels.Save" class="formButton" />
    <input type="button" id="btnCancel" value="@Labels.Cancel" class="formButton" />
</div>

Controller:

public ActionResult EventCategoryNameExists(int eventCategoryId, string name)
{
    return Json(!_eventService.EventCategoryNameExists(eventCategoryId, name), JsonRequestBehavior.AllowGet);
}

回答1:

Client-side validation is never enough. Javascript cannot be counted on to be enabled or correct, plus it can be bypassed by a devious user. But is your client-side validation routine returning a boolean false? If not, the normal submit action will take place regardless.

回答2:

Your dataannotations are processed on the server side as well - so you are OK as far as that is concerned. The remote validation attribute is not though. You need a custom validation attribute or need to also check this same routine on the server side. Extract out your validation call to a general method that you check in your HttpPost action (and if it fails use ModelState.AddError) and also have your remote validation method all this so and you should be good. Remote validation is still a decent client side feature so I wouldn't completely scrap it if you want that functionality.

As for your specific timing issue - I just did some testing on my remote validation page. I setup fiddler to have breakpoints before requests. I cannot submit my form until I return a response from the server. Try with fiddler and see if you can reproduce it that way. Im curious if something else on your page is stomping out your remote validation. I had an issue with a newer version of jQuery and remote validation. When I defaulted back to the basic MVC3 project it worked just fine - I didn't debug it further then but it was because of version differences.

来源：https://stackoverflow.com/questions/5761432/prevent-form-from-submitting-when-using-unobtrusive-validation-in-asp-net-mvc-3