How to write custom client-side jQuery validation in ASP.NET MVC 2 RC? -


i've read phil haack's post on custom client-side validation in asp.net mvc 2. want same thing jquery adapter , using asp.net mvc 2 rc (as opposed mvc 2 beta post uses). has been able figure how this?

i specially want implement password matching validation (i.e. password & confirm password must match). asp.net mvc 2 rc vs.net project template show how implement on server-side (using propertiesmustmatchattribute) not on client-side.

i assume followed phil haack's instructions here http://haacked.com/archive/2009/11/19/aspnetmvc2-custom-validation.aspx) on how custom validation working ms ajax client validation. work jquery, you'll need modify microsoftmvcjqueryvalidation.js file:

  • in __mvc_createrulesforfield(validationfield) function, you'll need add case statement. continuing phil's example, you'll need add:

    case "price":

    __mvc_applyvalidator_price(rulesobj, thisrule.validationparameters["min"]);

    break;

  • you'll need create __mvc_applyvalidator_price function:

function __mvc_applyvalidator_price(object, value) {

// min jquery validate uses validate minimum values object["min"] = value; 

}

that should enough phil's example working.

now, regarding propertiesmustmatchattribute validation, doesn't mvc generates client-side json validation definition attributes decorate classes. since propertiesmustmatchattribute must used on model (and not property), can't figure out how make trigger client-side validation. instead, took different approach. created dummy validation attribute who's isvalid() overload returns true, , used attribute on property. dummy attribute delegate validation logic jquery validator's equalto function. here's dummy attribute:

public class propertiesmustmatchclienttriggerattribute : validationattribute {     public string matchproperty { get; set; }      public propertiesmustmatchclienttriggerattribute(string matchproperty)     {         matchproperty = matchproperty;         errormessage = "{0} doesn't match {1}.";     }     public override bool isvalid(object value)     {         return true;     }      public override string formaterrormessage(string name)     {         return string.format(cultureinfo.currentculture, errormessagestring, name, matchproperty);     } } 

here custom validator:

public class propertiesmustmatchclienttriggervalidator : dataannotationsmodelvalidator<propertiesmustmatchclienttriggerattribute> {     private string _message;     private string _matchproperty;      public propertiesmustmatchclienttriggervalidator(modelmetadata metadata, controllercontext context, propertiesmustmatchclienttriggerattribute attribute)         : base(metadata, context, attribute)     {         _message = attribute.formaterrormessage(metadata.displayname);         _matchproperty = attribute.matchproperty;     }      public override ienumerable<modelclientvalidationrule> getclientvalidationrules()     {         var rule = new modelclientvalidationrule         {             errormessage = _message,             validationtype = "equalto"         };         rule.validationparameters.add("matchfield", _matchproperty);          return new[] { rule };     } } 

the above custom validator needs registered in application_start() per phil's blog:

dataannotationsmodelvalidatorprovider.registeradapter(typeof(propertiesmustmatchclienttriggerattribute), typeof(propertiesmustmatchclienttriggervalidator));

finally, need modify microsoftmvcjqueryvalidation.js file:

  • add following case statement __mvc_createrulesforfield:

case "equalto":

__mvc_applyvalidator_equalto(rulesobj, thisrule.validationparameters["matchfield"]);

break;

  • add function:

function __mvc_applyvalidator_equalto(object, elemid) {

object["equalto"] = document.getelementbyid(elemid); 

}

now need attach dummy validation attribute property:

    [propertiesmustmatchclienttrigger("password")]     public string confirmpassword { get; set; } 

that should it.

creating dummy attribute bit ugly, hope can come more elegant solution.


Comments

Popular posts from this blog

c++ - Convert big endian to little endian when reading from a binary file -

C#: Application without a window or taskbar item (background app) that can still use Console.WriteLine() -

unicode - Are email addresses allowed to contain non-alphanumeric characters? -