asp.net - Mixing asp mvc3 unobtrusive validation with jquery validation plugin -


for asp mvc3 client side validation, possible mix default, out of box unobtrusive style jquery validation plugin?

this form in view :

@using (html.beginform("", "", formmethod.post, new { id = "newratingform" })) {        @html.validationsummary(true)     <fieldset>         <legend>rating</legend>          <div class="editor-label">             @html.labelfor(model => model.rate)         </div>         <div class="editor-field">             @html.editorfor(model => model.rate)             @html.validationmessagefor(model => model.rate)         </div>          <div class="editor-label">             @html.labelfor(model => model.email)         </div>         <div class="editor-field">             @html.editorfor(model => model.email)             @html.validationmessagefor(model => model.email)         </div>          <p>             <input type="submit" value="create" />         </p>     </fieldset> } 

unobtusive works great default using usual validation attributes on properties of model . goal replace 'model.rate' bits in form [fyneworks][1] jquery star rating plugin , use jquery validation plugin part of form:

<span>your rating:</span> <div id="ratingstars">     <input class="star {split:2}" type="radio" name="rating" value="0.5"/>     <input class="star {split:2}" type="radio" name="rating" value="1.0"/>     <input class="star {split:2}" type="radio" name="rating" value="1.5"/>     <input class="star {split:2}" type="radio" name="rating" value="2.0"/>     <input class="star {split:2}" type="radio" name="rating" value="2.5"/>     <input class="star {split:2}" type="radio" name="rating" value="3.0"/>     <input class="star {split:2}" type="radio" name="rating" value="3.5"/>     <input class="star {split:2}" type="radio" name="rating" value="4.0"/>     <input class="star {split:2}" type="radio" name="rating" value="4.5"/>     <input class="star {split:2}" type="radio" name="rating" value="5.0"/> </div> 

i've hijacked submit action form , converted form values json ajax request :

$("#newratingform").submit(function (event) {     event.preventdefault();      if ($(this).valid()) {                 newratingsubmit();     }     });   function newratingsubmit() {     //jquery ajax request using form values converted json } 

radio buttons seem break form , hijack code no longer works i.e. when click submit, no request made server (watching on firebug console) , form disappears. again, works fine plain mvc3 form.

i tried adding jquery validation rule rating radio buttons didn't seem make difference :

$("#newratingform").validate({     meta: "validate",      errorlabelcontainer: "#errordiv",     wrapper: "div",     rules:     {         rating: {             required: true         }     },      messages:     {         rating: {             required: 'a rating required.'         }     },      onfocusout: false,     onkeyup: false,      //handle validation ok, post submit     submithandler: function (label) {         newratingsubmit();     }  }); 

as alternative can validate standard html form using star rating plugin using jquery validation plugin , submit above code doesnt seem 'asp.net mvc'. example need 2 sets of validation messages - 1 server using validation attributes , client view.

jquery.validator.addmethod("methodename", function (value, element, params) {         if (somthing) {             return false;         }         return true;     });      jquery.validator.unobtrusive.adapters.addbool("methodename"); 

and in html add 2 attributes

dal-val = true , dal-val-methodename="errormessage"


Comments