View is not generating validation attributes for client side validation

Topics: Writing modules
Feb 29, 2012 at 4:02 PM
Edited Feb 29, 2012 at 4:02 PM

I'm having issues with my view not generating the required validation attributes needed for the jquery.validation.min.js and jquery.validation.unobtrusive.min.js.

 

Here is my code for my view

@model MyModule.Models.FormPart

@{
    HtmlHelper.ClientValidationEnabled = true;
    HtmlHelper.UnobtrusiveJavaScriptEnabled = true;
    
    Script.Require("jQuery");
    Script.Require("jQuery.validate").AtFoot();
    Script.Require("jQuery.validate.unobtrusive").AtFoot();
}

@using (Html.BeginFormAntiForgeryPost("Routable/MyModule/PostForm", FormMethod.Post))
{
    @Html.ValidationSummary(false);
        <fieldset>
        <legend>MyModule Legend</legend>

            @Html.LabelFor(m => m.FirstName, T("First Name"))
	    @Html.TextBoxFor(m => m.FirstName)
	    @Html.ValidationMessageFor(m => m.FirstName)

            <input class="button primaryAction" type="submit" value="@T("Send")" />
        </fieldset>
}
Code for my model (the formpart)
using System.ComponentModel.DataAnnotations;

namespace MyModule.Models
{	
	public class FormPart : ContentPart<FormPartRecord>
	{
        [Required(ErrorMessage = "Please fill in your first name.")]
        [StringLength(100, ErrorMessage = "That name is too long.")]
        [Display(Name = "First Name")]
        public string FirstName
        {
            get
            {
                return Record.FirstName;
            }
            set
            {
                Record.FirstName = value;
            }
        }

    }
}

The HTML that my view outputs, as you can see it's not including the validation attributes so I'm not getting client side validation.

<label for="FirstName">First Name</label>
<input id="FirstName" name="FirstName" type="text" value="">
<span class="field-validation-valid" data-valmsg-for="FirstName" data-valmsg-replace="true"></span>

Feb 29, 2012 at 7:52 PM

Found the solutions. The solution is described in this discussion http://orchard.codeplex.com/discussions/278362

 

1) Basically add a reference to the Autofac assembly in your custom module.

 

Then add the following code

 

    public class RegisterValidationProviders : Module
    {
        protected override void Load(ContainerBuilder builder)
        {
            base.Load(builder);

            ModelValidatorProviders.Providers.Clear();
            ModelValidatorProviders.Providers.Add(new DataAnnotationsModelValidatorProvider());
            ModelValidatorProviders.Providers.Add(new DataErrorInfoModelValidatorProvider());
            ModelValidatorProviders.Providers.Add(new ClientDataTypeModelValidatorProvider());
        }
    }

Feb 29, 2012 at 8:07 PM

Is there any drawback to overriding the LocalizedModelValidatorProvider that Orchard uses by default? Why does orchard clear all them out and use that localized one? 

Coordinator
Feb 29, 2012 at 8:29 PM

It lets you define localizations for Data annotations like [ErrorMessage]

Feb 29, 2012 at 9:15 PM

Is the use of that one mutually exclusive with the three in odnxe's code snippet? 

Mar 17, 2012 at 7:50 AM
Edited Mar 17, 2012 at 8:14 AM

Just fix the problem, it seems the adapter is not registered for the new localized attributes.

Inside LocalizedModelValidatorProvider, in the constructor, register for the 4 attributes for example

 

DataAnnotationsModelValidatorProvider.RegisterAdapter(typeof(LocalizedRequiredAttribute, typeof(RequiredAttributeAdapter))

 

Just tried with Remote validation. Works as well

Mar 17, 2012 at 7:02 PM
ravetam wrote:

Just fix the problem, it seems the adapter is not registered for the new localized attributes.

Inside LocalizedModelValidatorProvider, in the constructor, register for the 4 attributes for example

 

DataAnnotationsModelValidatorProvider.RegisterAdapter(typeof(LocalizedRequiredAttribute, typeof(RequiredAttributeAdapter))

 

Just tried with Remote validation. Works as well

Tried this and it does work to make the data validation attributes render on the properties. But i don't notice any unobtrusive validation taking place on the browser. I included jquery, jquery.validate, and jquery.validate.unobtrusive .js files in the view (verified they are included on the browser), and also enabled ClientValidation and UnobtrusiveJavaScriptValidation properties in both webconfig and programmatically. 

Am I doing this wrong? The property has a required] attrib on it. When I focus away from the field in the browser shouldn't it pop up some validation? 

@{ 
    HtmlHelper.ClientValidationEnabled = true;
    HtmlHelper.UnobtrusiveJavaScriptEnabled = true;
    Layout.Title = T("Edit School").ToString(); 
}
@using (Script.Head()) {

    Script.Require("jQuery").AtHead();
    Script.Include("jquery.validate.js").AtHead();
    Script.Include("jquery.validate.unobtrusive.js").AtHead(); 
}

Mar 18, 2012 at 8:55 AM

Did you put inline validation message at the property?

@Html.LabelFor(m=>m.PackageId, T("PackageId"))

@Html.ValidationMessageFor(m=>m.PackageId)