Question

我有两个MySQL表：

'country'，包含字段：'country_id'和'country'
'city'包含字段：'city_id'，'city'，'city_link'和'country_id'

我想构建一个html双下拉菜单，用户可以选择“国家/地区”，然后根据“国家/地区”选择“城市”。此外，一旦选择了“城市”，我希望使用href“city_link”进行onClick事件，该事件将用户带到另一个页面。

有两个文件（ajaxcalling.php）：

<?
include("/connection.php");
$ID=$_REQUEST['country_id'];
$connect=mysql_connect($hostname_c, $username_c, $password_c);
echo 'Details:<select name="details" width="100">';
$result = mysql_db_query($database, "SELECT * FROM c_city WHERE country_id=".$ID);
while($row = mysql_fetch_array($result, MYSQL_ASSOC))
{
 echo "<option value=".$row['city_id'].">".$row['city']."</option>";
}
echo '</select>';
mysql_close($connect);
?>

AND（dropdown.php）

<script>

function CreateXmlHttpObject() { //function to return the xml http object
    var xmlhttp=false;  
    try{
        xmlhttp=new XMLHttpRequest();//creates a new ajax object
    }
    catch(e)    {       
        try{            
            xmlhttp= new ActiveXObject("Microsoft.XMLHTTP");
//this is for IE browser
        }
        catch(e){
            try{
            req = new ActiveXObject("Msxml2.XMLHTTP");

//this is for IE browser
            }
            catch(e1){
                xmlhttp=false;//error creating object
            }
        }
    }

    return xmlhttp;
}


  function CategoryGrab(strURL)
 {         
 var req = CreateXmlHttpObject(); // function to get xmlhttp object
 if (req)
 {
  req.onreadystatechange = function()
 {
  if (req.readyState == 4) { //data is retrieved from server
   if (req.status == 200) { // which reprents ok status                    
     document.getElementById('details').innerHTML=req.responseText;

//put the results of the requests in or element
  }
  else
  { 
     alert("There was a problem while using XMLHTTP:\n");
  }
  }            
  }        
req.open("GET", strURL, true); //open url using get method
req.send(null);//send the results
 }
}

</script>

<?
include("connection.php");
$connect=mysql_connect($hostname_c, $username_c, $password_c)
  or die ("Mysql connecting error"); 

echo '<table align="center"><tr><td><center><form method="post" action="">Category:
<select name="category"         
onChange="CategoryGrab('."'".'ajaxcalling.phpcountry_id='."'".'+this.value);">';
$result = mysql_db_query($database, "SELECT * FROM c_country");
$nr=0;
while($row = mysql_fetch_array($result, MYSQL_ASSOC))
{
$nr++;
echo "<option value=".'"'.$row['country_id'].'" >'.$row['country']."</option>";
}
echo '</select>'."\n";
echo '<div id="details">Details:<select name="details" width="100" >';
$result = mysql_db_query($database, "SELECT * FROM c_city WHERE country_id=1");
while($row = mysql_fetch_array($result, MYSQL_ASSOC))
{
 echo "<option value=".$row['city_id'].">".$row['city']."</option>";
}
echo '</select></div>';
echo '</form></td></tr></table>';

mysql_close($connect);
?>

这是link

真的很感激一些帮助，因为我已经坚持了一段时间......

Answer 1

首先，你提供的链接搞砸了它没有显示任何内容。我做了一个观察源，发现了几件事。

您的脚本标记位于标记旁边。
您用来链接javascript文件的脚本标记是错误的，您应该关闭脚本标记。像这样的事情

<script type="text/javascript" src="path to ur file"></script>

依赖于这里是几个链接

www.huanix.com/files/dependent_select/dependent_select.php

http://bytes.com/topic/php/answers/708593-dependent-dropdown-list-mysql

http://www.plus2net.com/php_tutorial/ajax_drop_down_list.php

Answer 2

<?PHP
/*

1)  Passing variables to ajax is the same as submitting forms.  You should never trust user input.  You should always validate the data.  You should prevent SQL injection.  
2) Open needs to go before onstatereadychange function
*/

?>

<html>
<head>
<script language="javascript"> 

  function CategoryGrab(strURL)
 {         
 var req = CreateXmlHttpObject(); // function to get xmlhttp object
 if (req)
 {
  req.onreadystatechange = function()
 {
  if (req.readyState == 4) { //data is retrieved from server
   if (req.status == 200) { // which represents ok status                    
     document.getElementById('details').innerHTML=req.responseText;

//put the results of the requests in or element
  }
  else
  { 
     alert("There was a problem while using XMLHTTP:\n");
  }
  }            
  }        
req.open("GET", strURL, true); //open url using get method
req.send(null);//send the results
 }
}

// what I use:
// Pretty sure you're open needs to go before the onreadystatechange function
function makeAjaxGetRequest(url, output, image) {
  if( image == 1 ){
      document.getElementById(output).innerHTML='<img src="./images/template/ajax-loader.gif"></img>'; 
  }
  if(xmlhttp) { 
    xmlhttp.open("GET",url,true); 
    xmlhttp.onreadystatechange = function(){
       if (xmlhttp.readyState == 4) {
         if(xmlhttp.status == 200) {
           document.getElementById(output).innerHTML=xmlhttp.responseText; //Update the HTML Form element 
         }
         else {
            alert("Error during AJAX call.");
         }
       }    
    }
    xmlhttp.send(null); //Posting txtname to PHP File
  }
}

</script>

双下拉菜单 - php MySQL Ajax

2 个答案: