multiselectable dropdown

[mariecon]

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

[~s.o.s~]

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.

[~s.o.s~]

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.

[digital-ether]

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.

[~s.o.s~]

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.

[digital-ether]

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.

[mariecon]

Thanks for your reply. :D