ASP.NET MVC 2 RC client side validation not working

Question

I can't seem to get any client side validation working on a MVC 2 RC app.

My model has the following:

public class ExampleModel
{
    [Required(ErrorMessage="Test1 is required")]
    [DisplayName("Test1")]
    public string Test1 { get; set; }

    [Required(ErrorMessage="Test2 is required")]
    [DisplayName("Test2")]
    public string Test2 { get; set; }
}

My view has the following code:

<% Html.EnableClientValidation(); %>
<%= Html.ValidationSummary(true, "Test was unsuccessful.") %>    
<% using (Html.BeginForm()) { %>
<div>
    <div class="editor-label">Test1:</div>
    <div class="editor-field">
        <%= Html.TextBoxFor(m => m.Test1) %>
        <%= Html.ValidationMessageFor(m => m.Test1) %>
    </div>

    <div class="editor-label">Test2:</div>
    <div class="editor-field">
        <%= Html.TextBoxFor(m => m.Test2) %>
        <%= Html.ValidationMessageFor(m => m.Test2) %>
    </div>

    <p>
        <input type="submit" value="Test" />
    </p>
</div>

I leave both fields blank and click the Test button and it goes right to the controller's post handler with no client side validation happening. I am not sure what I am missing.

I have the following javascript also included in the view (not sure if I need it all):

<link href="../../Scripts/jquery-1.3.2.min.js" type="text/javascript" />
<link href="../../Scripts/jquery.validate.min.js" type="text/javascript" />    
<link href="../../Scripts/MicrosoftMvcValidation.js" type="text/javascript" /> 

Any ideas what I am doing wrong. I feel like I am missing something simple and the documentation for MVC 2 is sparse.

Edit: I have added the link:

<link href="../../Scripts/MicrosoftMvcJQueryValidation.js" type="text/javascript" />

And I have included the file in my project which I had to download from on of the links in the answers. Still not working at all. Any other ideas?

Edit: I am using Visual Studio 2008 with MVC 2 RC (not beta) and I am looking for any downloadable or posted examples of client-side validation working with the RC release.

Answer 1

When you update project from MVC 2 Beta, use: /src/MvcFutures/MicrosoftMvcJQueryValidation.js from MVC 2 RC Source Code Package (link). Older Beta version do not work correctly with jquery.validation in RC. Needed javascript files are:

<script src="/Scripts/jquery-1.3.2.min.js" type="text/javascript" />
<script src="/Scripts/jquery.validate.min-vsdoc.js" type="text/javascript" />
<script src="/Scripts/MicrosoftMvcJQueryValidation.js" type="text/javascript" />

Right version of MicrosoftMvcJQueryValidation.js contains this $(document).ready() function:

// need to wait for the document to signal that it is ready
$(document).ready(function() {
    var allFormOptions = window.mvcClientValidationMetadata;
    if (allFormOptions) {
        while (allFormOptions.length > 0) {
            var thisFormOptions = allFormOptions.pop();
            __MVC_EnableClientValidation(thisFormOptions);
        }
    }
});

at the end of file (in RC release).

Answer 2

Ok I figured this out... and it is 100% my fault. Although, a couple of the posts included some information that I did need also.

The main problem, which I am suprised no one noticed, was my HTML to include the scripts... look up at my post and see if you can see the problem.

I was using a <link href=... tag instead of the proper <script src=... tag. Totally my fault as I had quickly cut and pasted the CSS link without thinking and just changed the type and file. Duh!!!

Anyways the correct links required are:

<script src="/Scripts/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="/Scripts/jquery.validate.min.js" type="text/javascript"></script>
<script src="/Scripts/MicrosoftMvcJQueryValidation.js" type="text/javascript"></script>

Everything works then. You definately do need to include the 'MicrosoftMvcJQueryValidation.js' file from the futures project so I am upvoted all the posts that mentioned that.

Out of the box though that file is NOT included. If your not worried about using JQuery then you can just use the following includes to use the Microsoft implementation which will work out of the box with the RC:

<script src="/Scripts/MicrosoftAjax.js" type="text/javascript"></script>
<script src="/Scripts/MicrosoftMvcAjax.js" type="text/javascript"></script>
<script src="/Scripts/MicrosoftMvcValidation.js" type="text/javascript"></script>    

I hope I can save at least one person some grief... I still can't believe how I could have screwed up the include and not noticed it for sooooo long.

Thanks again for all your help.