Question

I’m trying to use asp.net mvc’s 2 client validation ( <% Html.EnableClientValidation(); %>) with a modal box (facebox). and can’t get it to work. I’ve tried the following solutions and none of them worked:

http://www.phpvs.net/2010/04/26/manually-validate-an-asp-net-mvc-form-on-the-client-side-with-microsoftmvcvalidation-js-and-jquery/

http://aspnet.codeplex.com/WorkItem/View.aspx?WorkItemId=5270

http://tpeczek.com/2010/04/making-aspnet-mvc-2-client-side.html

I’ve tried both MicrosoftMvcJQueryValidation.js and MicrosoftMvcValidation.js.
The thing is that the validation apparently doesn’t load the form in the modal (facebox), while it does load the forms which are not in the modal.

anybody has an idea?

Answer 1

Hello I finally found a complete solution for client validating asp.net mvc with modal and ajax form :

1. use lambda expression text box and validation messages (TextBoxFor…)
2. in MicrosoftMvcJQueryValidation.js replace the ready function with a function call so you could call the init manually (See #Code1 below)
3. call EnableClientSideValidation from the ready function of your partial view (if you are using ajax link, call the function on the OnSuccess event).
4. if you are sending an ajax form, validate it with the lines in #Code2 below.

Code1

$(document).ready(function() {
    EnableClientSideValidation();
});

function EnableClientSideValidation() {
    var allFormOptions = window.mvcClientValidationMetadata;
    if (allFormOptions) {
        while (allFormOptions.length > 0) {
            var thisFormOptions = allFormOptions.pop();
            __MVC_EnableClientValidation(thisFormOptions);
        }
    }
}

Code2

function validate(formData, jqForm, options) {
    for (var i = 0; i < formData.length; i++) {
        if (!formData[i].value) {
            return false;
        }
    } 
} 

If you are using jquery forms than just add beforeSubmit: validate to your ajax form options.

that’s it!