Dynamic Drop Downs PHP AJAX




Im new to AJAX and PHP. Ive managed to create a two dynamic dropdowns
that manage to grab data from the database and use the value from the
first dropdown inside the SQL query to populate the second one.

However I need to be able to add more dropdown boxes and retain all
values selected so that i can use them in multiple different queries.
With about 6 dependant dropdowns in total.

I was wondering if anyone can point me in the right direction into
adding aditional dropdowns. Ive been scowering the net with ways to do
this however I don't know javascript very well. And im wondering if
someone can help me by looking at my code and letting me know what
needs to be added.

There are two fils.
local_dropdown.php and state.php

here is local_dropdown

echo "<form name=sel>\n";
echo "Type : <font id=type><select>\n";
echo "<option value=''>============</option> \n" ;
echo "</select></font>\n";

echo "Quality : <font id=quality><select>\n";
echo "<option value=''>=== none ===</option> \n" ;
echo "</select></font>\n";

echo "Quality : <font id=count><select>\n";
echo "<option value=''>=== none ===</option> \n" ;
echo "</select></font>\n";

<script language=Javascript>
function Inint_AJAX() {
try { return new ActiveXObject("Msxml2.XMLHTTP");  } catch(e) {} //IE
try { return new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) {} //
try { return new XMLHttpRequest();          } catch(e) {} //Native
alert("XMLHttpRequest not supported");
return null;


function dochange(src, val) {
var req = Inint_AJAX();
req.onreadystatechange = function () {
if (req.readyState==4) {
if (req.status==200) {
document.getElementById(src).innerHTML=req.responseText; //
retuen value

req.open("GET", "state.php?data="+src+"&val="+val); //make connection
req.setRequestHeader("Content-Type", "application/x-www-form-
urlencoded;charset=iso-8859-1"); // set Header
req.send(null); //send value


window.onLoad=dochange('type', -1);         // value in first dropdown

and here is state.php
(youll notice the code i tried to use for the 3rd dropdown is
commented out because i couldn't get it to function correctly.
//set IE read from page only not read from cache
//header ("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
//header ("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
////header ("Cache-Control: no-cache, must-revalidate");
//header ("Pragma: no-cache");

//header("content-type: application/x-javascript; charset=tis-620");


//set database
@mysql_select_db($database) or die( "Unable to select database");

if ($data=='type') {  // first dropdown
echo "<select name='type' onChange=\"dochange('quality', this.value)
echo "<option value=''>==== choose type ====</option>\n";
$result=mysql_db_query($database,"SELECT DISTINCT type FROM prod");
echo "<option value=\"$type\" >$type</option> \n" ;
} else if ($data=='quality') { // second dropdown

echo "<select name='quality' >\n";
echo "<option value=''>====choose quality ====</option>\n";
//$val = substr($val,0,2);
$result=mysql_db_query($database,"SELECT DISTINCT quality FROM prod
WHERE type='".$val."'");
echo "<option value=\"$$quality\" >$quality</option> \n" ;
/* } else if ($data=='count') { // third dropdown
echo "<select name='count' >\n";
echo "<option value=''>====choose count ====</option>\n";
$val = substr($val,0,4);
$result=mysql_db_query($database,"SELECT DISTINCT count FROM prod
WHERE type='".$val2."' && quality='".$val."'");
echo "<option value=\"$count\" >$count</option> \n" ;
} */

echo "</select>\n";

Any and all help appreciated.

Thanks in advance!!!

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Latest member

Latest Threads