jquery validation not working for this code

Question

Could anyone pleae figure out why this code is not working ? I can click submit button and go to next page without selecting anything. I want user to be allowed to go to next page only if the user selects any radio button. Thanks

<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'></script>
<script type='text/javascript' src='http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.js'></script>

  <script>
  $.noConflict();
  $(document).ready(function(){
    $("#form1").validate();
  });
  </script>

 <form method="post"  action="/action" id="form1" class="styled" enctype="multipart/form-data">
  <label for="name">1. Choose Category</label><br />
<select class="required" id="cat1" name="category">
                <option>select Category</option>

                    <option class="required" value="10">Cars</option>
                    <option class="required" value="8">House</option>
                    <option class="required" value="11">Mobiles</option>
                    <option class="required" value="3">Bus</option>
                    <option class="required" value="6">Services</option>
          </select>

        <input type="submit" name="buttonSubmit" value="Next Step"   class="btn-submit img-swap"  id="submit"  />
</form>

I might be wrong but it seems that the validation plugin requires jQuery 1.6.4+ and you are using v1.6.1, other than that your code seems to be fine. — JFK
– JFK, Commented Apr 6, 2013 at 6:01
I want user to be allowed to go to next page only if the user selects any radio button. there are no radio buttons in your code — JFK
– JFK, Commented Apr 6, 2013 at 6:17

JFK · Accepted Answer · 2013-04-06 06:41:53Z

1

From a quick view, your code seems to be fine but after a detailed view, the culprit is this html line :

<option>select Category</option>

... which also requires to have a(n) (empty) value attribute for the plugin to work properly, so it should look like :

<option value="">select Category</option>

... or much better :

<option selected="" value="" disabled="disabled">select Category</option>

See JSFIDDLE using jQuery v1.6.4, as in my previous comment

answered Apr 6, 2013 at 6:41

JFK

41.2k31 gold badges138 silver badges314 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jquery validation not working for this code

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related