JavaScript - Check for unique values in select boxes

Question

Couldn't find anything quite what I was looking for but if I've missed something obvious I'm sorry. I'm basically trying to have a JavaScript function check that each of a number of select boxes have unique values before the form is submitted to then be entered into a database.

There could be any number of select boxes but all follow a similar naming format in the form of:

operator_address_type_0
operator_address_type_1
operator_address_type_2
etc.

I was just wondering how a JavaScript function could be set up to loop through all of the select boxes and alert the user and stop the submitting if any are found to have the same value.

Thanks for any help.

EDIT:

Here is some simplified HTML of my current select boxes. I've had to simplify it a lot as the table that they are in is all loaded via AJAX from querying a database.

<select name="operator_address_type_0">
<option value="Main">Main</option>
<option value="Payment">Payment</option>
<option value="Poster">Poster</option>
</select>

<select name="operator_address_type_1">
<option value="Main">Main</option>
<option value="Payment">Payment</option>
<option value="Poster">Poster</option>
</select>

It is like that but there could be more options in the future, I just want to check that there is only one main address, one payment address, one poster address etc.

I've updated my post, hopefully it makes it a bit more clearer for you — Rob O'Brien
– Rob O'Brien, Commented Apr 9, 2012 at 15:50
should the values be unique in each select box separately, or globally? — szajmon
– szajmon, Commented Apr 9, 2012 at 15:52

nnnnnn · Accepted Answer · 2012-04-09 16:31:07Z

4

Something like the following?

function checkDuplicates() {
  var selects = document.getElementsByTagName("select"),
      i,
      current,
      selected = {};
  for(i = 0; i < selects.length; i++){
    current = selects[i].selectedIndex;
    if (selected[current]) {
      alert("Each address type may not be selected more than once.");
      return false;
    } else
      selected[current] = true;
  }
  return true;
}

Demo: http://jsfiddle.net/GKTYE/

This loops through the selects and records the selected index of each, stopping if a duplicate is found. This assumes all the selects have the same options in the same order. To test the actual selected values:

 current = selects[i].options[selects[i].selectedIndex].value;

edited Apr 9, 2012 at 16:31

answered Apr 9, 2012 at 16:11

nnnnnn

150k30 gold badges210 silver badges247 bronze badges

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

4 Comments

Rob O'Brien Over a year ago

This just seems to always alert the user even if the values are different

Rob O'Brien Over a year ago

hmm, does it matter if the select is within a table? I wouldn't have thought it would?

Rob O'Brien Over a year ago

I added in an alert : 'alert(current);' and it shows 1 then 0 then 0 again. the first two are correct as I only have two select boxes in this test but I'm not sure where the third 0 is coming from

Rob O'Brien Over a year ago

finally got it to work, turned out it was a problem with another plugin I had installed changing the table which in turn was duplicating the column with the select boxes in making the function always find a duplicate value!

Collectives™ on Stack Overflow

JavaScript - Check for unique values in select boxes

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related