Ajax Menu

Hi,

I have the following function which fills a text field depending on what is entered in a previous field. However i want to change this slightly so that a menu is filled rather than a textfield.

What do i need change below:

function showHint(str)
{
if (str.length==0)
  { 
  document.getElementById("txtHint").innerHTML="";
  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
	document.register_account.university.value = xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","update-university.php?q="+str,true);
xmlhttp.send();
}

Code (markup):

Cheers,
Adam

 

Why don't you try jQuery and parse a json result from the php so that you can easily build your menu ?

You can also have a look at :
Generate a menu from a mysql database using ajax and php

 

Thanks but i think the above is working fine if this change can be made.

 

what do you mean by menu? do you mean a drop down box? or a list?

 

Sorry, yes i meant to say list.

 

Well you need to change the server-side page: update-univerity.php to output the list as html (e.g <ul><li> etc.) then just change:
document.register_account.university.value = xmlhttp.responseText;
to:
document.getElementById("listdiv").innerHTML = xmlhttp.responseText;
and add a div to the html of the page (where you want the list to appear) :
<div id="listdiv"></div>

 

I am really sorry about this but i am an idiot and meant to say drop down select menu. Any chance you could have another look at it?

 

Do in your php the return values as :
<select value="the_value">the_name</select>

and afterwards use : document.getElementById("selectid").innerHTML = xmlhttp.responseText;

 

Great stuff thanks a lot.