help with FAQ/Code Snippet Repository script

cherubrock74 · May 16, 2009

I found what I was looking for in the FAQ/Code Snippet Repository section of this forum.

It is the code to create 3 ajax based drop down menus.

After your contribution on previous posts, I was able to troubleshoot the code and I was able to populate the first drop down menu. No luck with the second and the third since they are not displaying any data even when the user picks a selection from the first menu.

Can someone help me improve the code?

This is something I do not understand...

//link to the PHP file your getting the data from
   //var loaderphp = "register.php";
   //i have link to this file
   var loaderphp = "<?php echo $_SERVER['PHP_SELF'] ?>";

does the author mean I should substitute the php line with something like this

var loaderphp = '"confirm.php";

where confirm.php is the file I want to use to email che information?

Why is it just the first menu working?

what is wrong with the code?


<?php

$hostname = "?????????";
$username = "?????????";
$password = "?????????";

?>

<?php
$dbh = mysql_connect($hostname, $username, $password)
or die("Unable to connect to MySQL");
$selected = mysql_select_db("my_database_name_here",$dbh);
    if( isset($_POST['Submit']) )
    {
    echo "<pre>";
    print_r($_POST);
    }
    if( isset($_GET['ajax']) )
{
//In this if statement
switch($_GET['ID'])
{
case "LBox2":
$query = sprintf("SELECT * FROM list2 WHERE List1Ref=%d",$_GET['ajax']);
break;
case "LBox3":
$query = sprintf("SELECT * FROM list3 WHERE List2Ref=%d",$_GET['ajax']);
break;
}

$result = mysql_query($query);
echo "<option value=''></option>";
while ($row = mysql_fetch_assoc($result))
{
echo "<option value='{$row['ID']}'>{$row['Name']}</option>\n";
}
mysql_close($dbh);
exit; //we're finished so exit..
}

if (!$result = mysql_query("SELECT * FROM list1"))
{
echo "Database is down<br />".mysql_error();
}
//for use with my FIRST list box
$List1 = "";
while ($row = mysql_fetch_assoc($result))
{
$List1 .= "<option value='{$row['ID']}'>{$row['Name']}</option>\n";
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Simple Dymanic Drop Down</title>
<script language="javascript">
function ajaxFunction(ID, Param)
{
   //link to the PHP file your getting the data from
   //var loaderphp = "register.php";
   //i have link to this file
   var loaderphp = "<?php echo $_SERVER['PHP_SELF'] ?>";
   
   //we don't need to change anymore of this script
   var xmlHttp;
   try
    {
      // Firefox, Opera 8.0+, Safari
      xmlHttp=new XMLHttpRequest();
    }catch(e){
      // Internet Explorer
      try
      {
         xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
      }catch(e){
         try
         {
            xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
         }catch(e){
            alert("Your browser does not support AJAX!");
            return false;
         }
      }
   }
   
   xmlHttp.onreadystatechange=function()
   {
      if(xmlHttp.readyState==4)
        {
        //the line below reset the third list box incase list 1 is changed
        document.getElementById('LBox3').innerHTML = "<option value=''></option>";
        
        //THIS SET THE DAT FROM THE PHP TO THE HTML
	document.getElementById(ID).innerHTML = xmlHttp.responseText;
        }
   }
    xmlHttp.open("GET", loaderphp+"?ID="+ID+"&ajax="+Param,true);
    xmlHttp.send(null);
}
</script>
</head>
<body>
<!-- OK a basic form-->
<form method="post" enctype="multipart/form-data" name="myForm" target="_self">
<table border="0">
  <tr>
    <td>
      <!--
      OK here we call the ajaxFuntion LBox2 refers to where the returned date will go
      and the this.value will be the value of the select option
      -->
      <select name="list1" id="LBox1" onchange="ajaxFunction('LBox2', this.value);">
         <option value=''></option>
      <?php 
         echo $List1;
      ?>
      </select>
   </td>
    <td>
      <select name="list2" id="LBox2" onchange="ajaxFunction('LBox3', this.value);">
      <option value=''></option>
            <!-- OK the ID of this list box is LBox2 as refered to above -->
      </select>
   </td>
   <td>
      <select name="list3" id="LBox3">
      <option value=''></option>
            <!-- OK the ID of this list box is LBox3 Same as above -->
      </select>
   </td>
  </tr>
</table>
  <input type="submit" name="Submit" value="Submit" />
</form>
</body>
</html>

DB has 3 rows: list1, list2 and list3

Sign In

help with FAQ/Code Snippet Repository script

Recommended Posts

cherubrock74

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information