jquery - Unobtrusive Client side validation in MVC4 not working -
i have layout page scripts shown below.
<!doctype html> <html lang="en"> <head> <title>my site</title> <link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" /> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <some custom css> <modernizr> <script src="~/scripts/jquery/jquery-1.9.1.js"></script> <script src="~/scripts/jquery/jquery-ui-1.10.2.js"></script> <script src="~/scripts/jquery/jquery.unobtrusive-ajax.js"></script> <script src="~/scripts/jquery/jquery.validate.js"></script> <script src="~/scripts/jquery/jquery.validate.unobtrusive.js"></script> <some custom scripts> <bootstrap scripts> <knockout scripts> </head> <body> @renderbody() </body> </html> then have registration form shown
@model mysite.models.account.account @{ layout = "~/views/shared/_layout.cshtml"; } @using (html.beginform(null, null, formmethod.post, new { id = "register" })) { @html.antiforgerytoken(); <h1>login</h1> @html.validationsummary(); @html.editorfor(m => m.name) @html.editorfor(m => m.address1) @html.editorfor(m => m.address2) @html.editorfor(m => m.phone1) <input type="button" value="register" id="btn1" /> } <script> var form = $("#register"); $("#btn1").click(function (e) { e.preventdefault(); $.ajax({ url: 'http://localhost:3885/account/register', data: form.serialize(), type: 'post', success: function (result) {}, error: function (req, status, error) { function(req, status, error); } }); }); </script> my account model class follow :
public class account { public name name {get; set;} public address address1 {get; set;} public address address2 {get; set;} public phone phone1 {get;set;} } where each property model class own editortemplates example
public class name { [required] public string firstname {get; set;} public string middlename {get; set;} [required] public string lastname {get; set;} } and have name.cshtml editortemplate below
<div > @html.textboxfor(m=>m.firstname); @html.textboxfor(m=>m.middlename); @html.textboxfor(m=>m.lastname); <div> similarly address.cshtml , phone.cshtml
in web.config: -
<add key="clientvalidationenabled" value="true" /> <add key="unobtrusivejavascriptenabled" value="true" /> on clicking register button on empty form ajax post register [httppost] controller method. why not give me client side validation messages think called unobtrusive validation ? don't see errors in console well.
the submit button must of type 'submit' trigger jquery validate validation, whether using jquery plugin on own or unobtrusive plugin.
so trigger validation:
<input type="submit" value="register" id="btn1" /> but seeing have have written code handle button click, might easier manually trigger validation
$("#btn1").click(function (e) { e.preventdefault(); // trigger form validation, result 1 or 0 var result = $('form').valid(); $.ajax( // details omitted ); }); 
Comments
Post a Comment