hii friends
i am trying to create a drop down menus in which my 2nd menu will depend on 1st one ...and 3rd on 2nd and so on til 5 dropdown menus.
for eg if my 1st menu contain
India
US
Canada
and then suppose i select Canada then my 2nd dropdown menu should Display me all the cities in canada...
.....
... & so on.
nw the point is every dropdown menu(from 1st till last) has to take data from database.(depending on 1st selection by user)...my database is mysql.
i want all five menus on one page
i am trying to do it with ajax and php please help i m not able to solve it.
MY CODE IS
MAIN.php
<html>
<head>
<script>
function getXMLHTTP()
{ //fuction to return the xml http object
var xmlhttp=false;
try{
xmlhttp=new XMLHttpRequest();
}
catch(e) {
try
{
xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e)
{
try{
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e1){
xmlhttp=false;
}
}
}
return xmlhttp;
}
function getmodel(makeid)
{
var strURL="findmodel.php?make="+makeid;
var req = getXMLHTTP();
if (req)
{
req.onreadystatechange = function()
{
if (req.readyState == 4)
{
// only if "OK"
if (req.status == 200) {
document.getElementById('modeldiv').innerHTML=req.responseText;
} else {
alert("There was a problem while using XMLHTTP:\n" + req.statusText);
}
}
}
req.open("GET", strURL, true);
req.send(null);
}
}
function getsno(makeid,modelid)
{
var strURL="findsno.php?make="+makeid+"&model="+modelid;
var req = getXMLHTTP();
if (req) {
req.onreadystatechange = function()
{
if (req.readyState == 4)
{
// only if "OK"
if (req.status == 200)
{
document.getElementById("modeldiv").innerHTML=req.responseText;
}
else
{
alert("There was a problem while using XMLHTTP:\n" + req.statusText);
}
}
}
req.open("GET", strURL, true);
req.send(null);
}
}
</script>
</head>
<body>
<form method="post" action="" name="form1">
<table width="60%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="150">make</td>
<td width="150"><select name="make" onChange="getmodel(this.value)">
<option value="">make</option>
<option value="1">Hp</option>
<option value="2">Dell</option>
</select></td>
</tr>
<tr style="">
<td>model</td>
<td ><div id="modeldiv"><select name="model" >
<option>Select make First</option>
</select></div></td>
</tr>
<tr style="">
<td>sno</td>
<td ><div id="snodiv"><select name="sno">
<option>Select model First</option>
</select></div></td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
</tr>
</table>
</form>
</body>
</html>FINDMODEL.php
<?php
$make=intval($_GET['make']);
$link = mysql_connect('localhost', 'root', 'success1234'); //changet the configuration in required
if (!$link)
{
die('Could not connect: ' . mysql_error());
}
mysql_select_db('my_db');
$query="SELECT modelno FROM model WHERE makeid='$make' ";
$result=mysql_query($query);
?>
<select name="--make--" onchange="getsno(<?=$make?>,this.value)">
<option>--Select model--</option >
<? while($row=mysql_fetch_array($result)) { ?>
<option value=<?=$row['id']?>> <?=$row['modelno']?></option>
<?
}
?>
</select>FINDSNO.php
<? php
$makeid=intval($_GET['make']);
$modelId=intval($_GET['model']);
$link = mysql_connect('localhost', 'root', 'success1234'); //changet the configuration in required
if (!$link) {
die('Could not connect: ' . mysql_error());
}
mysql_select_db('my_db');
$query="SELECT id,sno FROM serialno WHERE makeid='$makeid' AND modelid='$modelid'";
$result=mysql_query($query);
?>
<select name="sno">
<option>Select sno</option>
<? while($row=mysql_fetch_array($result)) { ?>
<option value><?=$row['sno']?></option>
<? } ?>
</select>