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
Post a Comment