Question

How Can i specific require and unique condition for a list of select box like below?

<form name="signupForm" class="cmxform" id="signupForm" method="get" action="">
<select name="category[]" id="cat_1">
<option value="">Select One</option>
<option value="1">aa</option>
<option value="2">bb</option>
<option value="3">cc</option>
<option value="4">dd</option>
</select>
<select name="category[]" id="cat_2">
<option value="">Select One</option>
<option value="5">ee</option>
<option value="6">ff</option>
<option value="7">gg</option>
<option value="8">hh</option>
</select>
<select name="category[]" id="cat_3">
<option value="">Select One</option>
<option value="9">ii</option>
<option value="10">jj</option>
<option value="11">kk</option>
<option value="12">ll</option>
</select>
<input class="submit" type="submit" value="Submit">
</form>

Notice that there are the number of cat is not fixed, it can be more than 3,

so how to make it required for each selectbox,

and each selectbox chosen value must be unique using jquery validate plugin? Thank you

Answer 1

var $selects = $('form select[name^=category]'),
    values = [];

$(':submit').click(function(e) {
  e.preventDefault();
  values = [];
  $($selects).each(function() {
      if($(this).val()) {
          values.push($(this).val());        
      }
  });
    if(!values.length) {
        alert('Please select all categories');
        return false;
    }
  if(values.length < $selects.length || $.unique(values).length < $selects.length) {
    alert('Please select all categories and be unique');
    return false;
  }
});

DEMO