s2000_com
asked on
Comboboxes cascading actions
Hi,
Using IE or FF, I've attached some code which work only with the first combobox but NOT with the 2nd in cascade.
Any suggestions ?
Thanks,
Phil
Using IE or FF, I've attached some code which work only with the first combobox but NOT with the 2nd in cascade.
Any suggestions ?
Thanks,
Phil
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
function showinfo1()
{
ucxmlHttp("getinfo1.php?q="+ document.info.infomain.value, "divinfo1");
setTimeout("showinfo2()",1000);
}
function showinfo2()
{
ucxmlHttp("getinfo2.php?q="+ document.info.info1.value, "divinfo2")
}
function ucxmlHttp(url, divid)
{
xmlHttp = GetXmlHttpObject();
if (xmlHttp==null)
{
alert ("Http Error");
return
}
url=url+"&sid="+Math.random();
xmlHttp.open("GET",url,true);
xmlHttp.onreadystatechange = function(foo)
{ return function()
{
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
document.getElementById(divid).innerHTML=xmlHttp.responseText
}
}
}(divid)
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>";
?>
ASKER
Hi hielo,
I made the changes but I have still an error : "document.info.info1.value " is null or not an object
Any idea ?
Thanks,
Phil
I made the changes but I have still an error : "document.info.info1.value
Any idea ?
Thanks,
Phil
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Thanks. It works great !
BTW: the reason for the error is that your <FORM> tag is NOT wrapping around ALL the form elements. It needs to enclose the selects as well.
ASKER
Thanks hielo ! I fixed this too.
Open in new window