Hello everyone,

I'm a newbie in AJAX. I have found a code in the web that uses AJAX and PHP (withjavascripts). It works well but i want to have a multiselectable dropdown. How can i retrieve the value of the multiselctable dropdown thruogh its javascript???

Here's the code that retrieve the value of the dropdown:

<script>
var xmlHttp
function showUser(str)
{
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
}
var url="php_code1.php" //the name of your php file - ajax code
url=url+"?q="+str
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}

function stateChanged()
{
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
document.getElementById("txtHint").innerHTML=xmlHttp.responseText //txtHint is the name of the div that can be replaced by the output of php file
}
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
//Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
}
return xmlHttp;
}
</script>

***How can i modify it so it will retrieve the value of the multiselectable dropdown which is an array? Please help me...

regards,
mariecon

Take a look at this post. It loops through all the options of a select box and checks for those which are selected. You can then construct a query string based on that.

For eg. if you have a select box name "selBox" from which you have selected two options "one" and "two", your query string should look like: url += "&selBox=one&selBox=two"; Here one and two would come from the snippet I just pointed you to.

Also don't forget to encode the query string to handle special characters or characters which already have a predetermined meaning in the querystring. (eg. &)

It would be better if you used a form serializing function which would serialize the entire form and return the resulting query string.

i know mootools has a method that will serialize the form into a query string. I'm sure other popular JS libraries will have one too.

Yes, there are many libraries out there which do this but many people are against using libraries which result in a visible bloat. Implementing our own serialize function or by using the functions from one of the existing libraries in a separate JS file would be much more feasible.

There is really no bloat in mootools. I think the whole lib compressed is about 4k. You can just get part of the library that does the serialization. That would be even less, around 2-3k. Most libraries have something around these lines.

You don't get much learning from using libraries though. Implementing your own give you a much better understanding of the solution.

Thanks for your reply.