ajax multiple select php

[trpost]

How can I accomplish the following using AJAX / PHP:

I have a form with a text field and a search button next to the text
field. When I type something in the text field and hit the search
button a query is performed and the results are dynamically entered
into a multiple select box below the textfield without reloading the
page, or affecting other form elements. If no data is found then an
error message is displayed in place of the multiple select box.

Seems pretty basic, but I am having trouble getting things going...

Thanks

 

[Darko]

How can I accomplish the following using AJAX / PHP:

I have a form with a text field and a search button next to the text
field. When I type something in the text field and hit the search
button a query is performed and the results are dynamically entered
into a multiple select box below the textfield without reloading the
page, or affecting other form elements. If no data is found then an
error message is displayed in place of the multiple select box.

Seems pretty basic, but I am having trouble getting things going...

Thanks

What have you tried yet?
The basic idea is really sending the ajax request, registering
callback function for any input from ajax, and parsing the results. If
everything is fine, find the <select> object, empty it and fill it
with results. If nothing is fine then find the <select> object
anyway, put its style.display to 'none' (if you want to hide it) and
put some error text in the designated space.
The only problem can be how to parse the ajax response, where maybe
the best way may be sending the xml in response, and ajax know
perfectly well how to automatically convert this into a DOM model,
which you can use at your will. If you don't know how to do this,
here's the code:
function getAJAXXMLHandler()
{
var xmlHttp = null;
try {
if (window.XMLHttpRequest) { // Mozilla, Safari,...
xmlHttp = new XMLHttpRequest();

if (xmlHttp.overrideMimeType)
xmlHttp.overrideMimeType('text/xml');
else
xmlHttp = null;
} else if (window.ActiveXObject) { // IE
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
} catch ( e ) {}
return xmlHttp;
}
Later, when you get the response from the xmlHttp object, you capture
its xml document by calling:
var xmldoc = ajax.responseXML;
and then
var documentRoot = xmlDocument.documentElement;
Once you get documentRoot, you can access all its children and
subchildren etc. by referencing .childNodes array attribute and that
is just wonderful