Jquery Validation live validation of form by form element id and submit form by ajax -


i have form.i want live validate form jquery validation plug-in.after finishing validataion of form want submit ajax.i want validate every fields of form id. have done far:

 <form id="booking-form" name="booking-form" method="post" class="form-horizontal">        <input type="text" id="firstname" value="" name="book[firstname]">    <input type="text" id="email" value="" name="book[email]">    <input type="text" id="contact" value="" name="book[contact]">       <input type="submit" id="submit-booking"  class="btn btn-primary btn-large" value="book now"/> 

in javascript function:

 $(document).ready(function() {          $("#booking-form").validate({     rules: {         "book[firstname]": {             required: true         },         "book[email]": {             required: true,             email: true         },         "book[contact]": {             required: true         }     },     submithandler: function (form) {      alert("fff");         var formdata = $(form).serialize();         //alert(formdata);           $.ajax({             url: "bs_client_function.php?action=new_b",             type: "post",             data: formdata,             beforesend: function () {              },             success: function (data) {              }         });         return false;      } });         }); 

it did not work.no validation error shows in form , no ajax request sending.how overcome problems??
in advance.

you have serious problems...

1) there absolutely no need put .validate() inside of click handler. it's supposed go inside dom ready event handler. why? because .validate() how initialize plugin, not method test form. testing done automatically once plugin initialized on form.

2) when rules declared inside .validate(), can assigned field name, not id , not jquery selector.

3) should use button inside of form rather link. submit button captured automatically plugin.

4) spelled required incorrectly on third field.

"#contact": {requred: true} 

working demo: http://jsfiddle.net/p5tvp/

$(document).ready(function () {      $("#booking-form").validate({         rules: {             "b[firstname]": {                 required: true             },             "b[email]": {                 required: true,                 email: true             },             "book[contact]": {                 required: true             }         },         submithandler: function (form) {             var formdata = $(form).serialize();             $.ajax({                 url: "bs_client_function.php?action=new_b",                 type: "post",                 data: formdata,                 beforesend: function () {                  },                 success: function (data) {                  }             });         }     });  }); 

Comments

Popular posts from this blog

c# - Operator '==' incompatible with operand types 'Guid' and 'Guid' using DynamicExpression.ParseLambda<T, bool> -