Pass array value in javascript

Question

I have list of groups:

 <select multiple="multiple" name="groups[]" id="groups[]" class="myclass">
<option value="1">Employee</option> 
<option value="2">Suppliers</option>
<option value="3">Customers</option>
 </select>

I am using the below code to pass the groups to the ajax url but ONLY one group is passed!!

<Script>
 groups=document.getElementById("groups[]").options.item(addIndex).value;
 xmlHttp.open("POST","?action=ajaxcontac&groups="+ groups,true);
</Script>

How Can I pass more than one group to the url?

Thanks

Answer 1

var opts = document.querySelectorAll("#groups\\[\\] option"),
 groups = [].map.call(opts, function(option) {
 if (option.selected) {
 return "groups[]=" + option.value;
 }
 }).filter(Boolean).join("&");
xmlHttp.open("POST", "?action=ajaxcontac&" + groups, true);

Demo

http://jsfiddle.net/XJLBA/1/

Answer 2

Try this solution: Reference all selected options in a multiple list.