validate hidden form element with jQuery Validation (for use with woocommerce reviews) -


i want validate hidden form jquery validation plugin work woocommerce reviews.

the html output is:

<form> <!-- later --> <div class="comment-form-rating-wrap"><p class="comment-form-rating"><label for="rating">overall rating</label><span class="required">*</span><p class="stars"><span><a class="star-1" href="#">1</a><a class="star-2" href="#">2</a><a class="star-3" href="#">3</a><a class="star-4" href="#">4</a><a class="star-5" href="#">5</a></span></p><select style="display: none;" name="rating" id="rating">         <option value="">rate…</option>         <option value="5">perfect</option>         <option value="4">good</option>         <option value="3">average</option>         <option value="2">not bad</option>         <option value="1">very poor</option>     </select></p><div class="rating-error">select rating</div><p></p></div>  </form> 

as can see there form element above hidden, because form instead displays stars (it's product review) , uses jquery hide select element , change stars:

        jquery('#rating').hide().before('<p class="stars"><span><a class="star-1" href="#">1</a><a class="star-2" href="#">2</a><a class="star-3" href="#">3</a><a class="star-4" href="#">4</a><a class="star-5" href="#">5</a></span></p>');  jquery('body')     .on( 'click', '#respond p.stars a', function(){         var jquerystar   = jquery(this);         var jqueryrating = jquery(this).closest('#respond').find('#rating');          jqueryrating.val( jquerystar.text() );         jquerystar.siblings('a').removeclass('active');         jquerystar.addclass('active');          return false;     })     .on( 'click', '#respond #submit', function(){         var jqueryrating = jquery(this).closest('#respond').find('#rating');         var rating  = jqueryrating.val();      }); 

so question how link jquery validation plugin?

it seems you're updating hidden select each time user clicks star. if that's case, need make sure hidden select validated, , jquery validate take care of rest:

$('#theoverallform').validate({      ignore:[],      rules: {          rating:'required'          //your other rules here      } }); 

the ignore:[] tells validate want validate hidden elements.

keep rest of code maintaining state of hidden select, rid of code things on submit of form, , deal in submithandler of validate.


Comments

Popular posts from this blog

basic authentication with http post params android -

vb.net - Virtual Keyboard commands -

How to get multiresult with multicondition in Sql Server -