reading option of three select tags with same name

Question

Hello

How can i have three or more select tags with same names(as in my program, the select tags are being generated dynamically), and select independently what option was selected. I have a loop, where my php reads a sql table, and for each row, it creats a select tag and a button with it.

<select name="vote">
    <option value="1">1</vote>
    <option value="2">2</vote>
    <option value="3">3</vote>
</select>

<input type="button" onclick="vote()">

So suppose i have 3 rows in my sql table, so 3 select tags with buttons would be created.

Now my question is how can i see what select tag has what option seleted??

Can anyone help me with this.

Zeeshan

Answer 1

If they have the same name, then the only way to distinguish between them is to have all their values be unique to a particular select element.

If that isn't possible, then you must give them different names (name="vote[<?php echo $row_id; ?>]" for instance).

Additionally, a "feature" of PHP requires that if you have multiple elements with the same name, the name must end in the characters "[]" in order for more then one of the submitted values to be accessed.

Answer 2

When you have multiple elements in a form with identical name attributes, they become a collection (essentially, an array) in the DOM.

So where you might have one select like this

<form name="test">
  <select name="example"></select>
</form>

You would access the select element like so

document.forms.test.example;

Now, if you had 2 or more, like this

<form name="test">
  <select name="example"></select>
  <select name="example"></select>
  <select name="example"></select>
</form>

You would access them in the DOM like this

document.forms.test.example[0];
document.forms.test.example[1];
document.forms.test.example[2];

EDIT

Oh, on the PHP end, it won't recognize multiple values unless you add [] to the name - this tells PHP to not replace same-key-name values, but rather use them as an array.

<form name="test">
  <select name="example[]"></select>
  <select name="example[]"></select>
  <select name="example[]"></select>
</form>

Then, you would read these values like so

<?php

$exampleArray = $_GET['example'];
// you can now loop over $exampleArray or whatever.

Answer 3

If you need three separate <select>s which must contain the same <option> values, then you need to have different name attributes, at least if you want to keep things simple. If -- however -- you can use some JS/jQuery, then you could set three different id's to those <select>s, and "simulate" different names with AJAX. Something like this:

var v1 = $("#select1").val();
var v2 = $("#select2").val();
var v3 = $("#select3").val();

$.ajax({
  type: "POST",
  url: "someurl.php",
  data: "select1="+v1+"&select2="+v2+"&select3="+v3,
  success: function(msg){
    alert( "Data Saved: " + msg );
  }
});

Answer 4

<script>
function vote(){
    var sIdx=document.getElementById('vote').selectedIndex;
    alert(document.getElementById('vote').options[sIdx].value);
}

</script>