Select multiple options, use them as array, and retrieve data from database without loading page

Question

I am not able to retrieve multiple select data from database without loading page.

I want to select more than one option and retrieve data depending on selection, here is the code for my select tag:

   <select name="country[]" multiple="multiple" onChange="getSkill(this.value)">
   <option value="">--Select Categoery--</option>
    <?php while ($row=mysql_fetch_array($result)) {
 $cid = $row['cid'];
  ?>
   <option value=<?php echo $row['cid']?>><?php echo $row['categotie']?></option>
  <?php } ?>
 </select>

And my AJAX code is:

          function getSkill(cid) {      

    var strURL="findskill.php?cid="+cid;
    var req = getXMLHTTP();

    if (req) {

        req.onreadystatechange = function() {
            if (req.readyState == 4) {
                // only if "OK"
                if (req.status == 200) {                        
                    document.getElementById('skilldiv').innerHTML=req.responseText;

                } else {
                    alert("Problem while using XMLHTTP:\n" + req.statusText);
                                  document.getElementById('marksdiv').innerHTML='<p name="marks">'+
                    '</p>';             
                }
            }               
        }           
        req.open("GET", strURL, true);
        req.send(null);
    }       
}

How can I retrieve multiple values?, I am able to retrieve only one value.

Answer 1

Depending on what you expect in your server have to correctly get the value, when working with multiple selections, instead of:

<select name="country[]" multiple="multiple" onChange="getSkill(this.value)">

If you are using jQuery, replace with:

<select name="country[]" multiple="multiple" onChange="getSkill($(this).val())">

Note that if you don't use jQuery you need a longer code.

Then, your function will receive [cid1, cid2, cid3, ....] .

Then, it depends on your server code, for example, if you expect in your server cid1,cid2,cid3 , replace:

var strURL="findskill.php?cid="+cid;

with:

var strURL = "findskill.php?cid=" + cid.join(',');

Fiddle