HTML/PHP Main Script (index.php)<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><script src="selectinfo.js"></script></head><body><form name="info"> Select an item :<select name="infomain" onchange="showinfo1()"><option value="1">Test 1</option><option value="2">Test 2</option><option value="3">Test 3</option></select></form>Info 1 :<div id="divinfo1"><select id="info1" onchange="showinfo2()"><option value="XXX">XXXXXX</option></select></div><br>Info 2 :<div id="divinfo2"><select id="info2"><option value="XXX">XXXXXX</option></select></div></body></html> ----------------------------------------------------------------Javascript (selectinfo.js)var xmlHttp=null;function showinfo1(){ ucxmlHttp("getinfo1.php?q="+ encodeURIComponent(document.info.infomain.value), "divinfo1",showinfo2);//NO. There is no guarantee that the first call will be done in 1 second. You need to call//it after the first request has completed!// setTimeout("showinfo2()",1000);}function showinfo2(){ ucxmlHttp("getinfo2.php?q="+ encodeURIComponent(document.info.info1.value), "divinfo2", null)}function ucxmlHttp(url, divid, subsequentcall ){ xmlHttp = GetXmlHttpObject(); if (xmlHttp==null) { alert ("Http Error"); return } url=url+"&sid="+Math.random(); xmlHttp.open("GET",url,true); //no need to double nest functions. divid will be visible within the function below without having to pass it as an argument xmlHttp.onreadystatechange = function(){ if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete") { document.getElementById(divid).innerHTML=xmlHttp.responseText if( subsequentcall ) subsequentcall(); } }; xmlHttp.send(null);}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;}----------------------------------------------------------------PHP getinfo1.php<?php$q=$_GET["q"];echo "<select id='info1' onchange='showinfo2()'>";echo "<option value='1'>Info ".$q.".1</option>";echo "<option value='2'>Info ".$q.".2</option>";echo "<option value='3'>Info ".$q.".3</option>";echo "</select>";?>----------------------------------------------------------------PHP getinfo2.php<?php$q=$_GET["q"];echo "<select id='info2'>";echo "<option value='1'>Info ".$q.".2.1</option>";echo "<option value='2'>Info ".$q.".2.2</option>";echo "<option value='3'>Info ".$q.".2.3</option>";echo "</select>";?>
Open in new window