2013-04-24 99 views
0

我正在创建动态下拉列表使用php mysql + ajax jquery,填充的第二个下拉列表是基于选择的第一个和第三个是基于第二个的选择但是它没有任何人可以帮助我吗?php mysql 3动态下拉列表与ajax jquery

dbconfig.php
<?php 
$host = "localhost"; 
$user = "****"; 
$password = "***"; 
$db = "lam_el_chamel_db"; 
?> 

select.php
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
    <head> 
     <script type="text/javascript" src="jquery.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function(){ 
      $("select#district").attr("disabled","disabled"); 
      $("select#village").attr("disabled","disabled"); 
      $("select#governorate").change(function(){ 

      $("select#district").attr("disabled","disabled"); 
      $("select#district").html("<option>wait...</option>"); 

      $("select#village").attr("disabled","disabled"); 
      $("select#village").html("<option>wait...</option>"); 

      var id = $("select#governorate option:selected").attr('value'); 
      $.post("select_district.php", {id:id}, function(data){ 
       $("select#district").removeAttr("disabled"); 
       $("select#district").html(data); 
      }); 

      var id2 = $("select#district option:selected").attr('value'); 
      $.post("select_village.php", {id:id}, function(data){ 
       $("select#village").removeAttr("disabled"); 
       $("select#village").html(data); 
      }); 

     $("form#select_form").submit(function(){ 
      var gover = $("select#governorate option:selected").attr('value'); 
      var dist = $("select#district option:selected").attr('value'); 



      if(gover>0 && dist>0) 
      { 
       var result = $("select#district option:selected").html(); 
       $("#result").html('your choice: '+result); 
      } 
      else 
      { 
       $("#result").html("you must choose two options!"); 
      } 
      if(dist>0 && village>0) 
      { 
       var result = $("select#village option:selected").html(); 
       $("#result").html('your choice: '+result); 
      } 
      else 
      { 
       $("#result").html("you must choose three options!"); 
      } 
      return false; 
     }); 
    }); 
     </script> 
    </head> 
    <body> 
    <?php include "select.class.php"; ?> 
     <form id="select_form"> 
      Choose a governorate:<br /> 
      <select id="governorate"> 

      <?php echo $opt->ShowGovernorate(); ?> 


      </select> 
      <br /><br /> 

      choose a district:<br /> 
      <select id="district"> 
       <option value="0">choose...</option> 
      </select> 
      <br /><br /> 

      choose a village:<br /> 
      <select id="village"> 
       <option value="0">choose...</option> 
      </select> 
      <input type="submit" value="confirm" /> 
     </form> 
     <div id="result"></div> 
    </body> 
</html> 

select_class.php
<?php 
class SelectList 
{ 
    protected $conn; 

     public function __construct() 

     { 
      $this->DbConnect(); 
     } 
    protected function DbConnect() 
    { 
    include "dbconfig.php"; 
    $this->conn = mysql_connect($host,$user,$password) OR die("Unable to connect to the database"); 
    mysql_select_db($db,$this->conn) OR die("can not select the database $db"); 
    return TRUE; 
    } 

    public function ShowGovernorate() 
    { 
      $sql = "SELECT * FROM governorate"; 
      $res = mysql_query($sql,$this->conn); 
      $governorate = '<option value="0">choose...</option>'; 
      while($row = mysql_fetch_array($res)) 
      { 
       $governorate .= '<option value="' . $row['governorate_id'] . '">' . $row['governorate_name'] . '</option>'; 
      } 
      return $governorate; 

    } 
    public function ShowDistrict() 
    { 
    $sql = "SELECT * FROM districts WHERE governorate_id=$_POST[id]"; 
    $res = mysql_query($sql,$this->conn); 
    var_dump($res); 
    $district = '<option value="0">choose...</option>'; 
     while($row = mysql_fetch_array($res)) 
     { 
     $district .= '<option value="' . $row['district_id'] . '">' . $row['district_name'] . '</option>'; 
     } 
    return $district; 
    } 

    public function ShowVillage() 
    { 
    $sql = "SELECT village_id, village_name FROM village WHERE district_id=$_POST[id2]"; 
    $res = mysql_query($sql,$this->conn); 
    $village = '<option value="0">choose...</option>'; 
     while($row = mysql_fetch_array($res)) 
     { 
     $village .='<option value="' .$row['village_id'] . '">' . $row['village_name'] . '</option>'; 
     } 
     return $village; 
    } 


} 
$opt = new SelectList(); 


?> 

select_district.php
<?php 
include "select.class.php"; 
echo $opt->ShowDistrict(); 
?> 

select_village.php

<?php 
include "select.class.php"; 
echo $opt->ShowVillage(); 
?> 

我认为它有select.php内的东西,但我不知道什么是错误

+0

您的代码很容易受到SQL注入。改用参数化查询。而“不起作用”不是很具描述性。你能告诉发生了什么,而不是预期的结果吗? – 2013-04-24 14:18:01

+0

@ Marcel Korpel没有工作意味着第二个和第三个下拉列表只显示默认选项**选择** – user2306354 2013-04-24 14:21:09

回答

0

你的Ajax调用上的document.ready函数来完成。你应该阿贾克斯绑定到像下拉改变功能:

$("select#district option:selected").change(function(){ 
id = $(this).val(); 
$.post("select_village.php", {id:id}, function(data){ 
    $("select#village").removeAttr("disabled"); 
    $("select#village").html(data); 
}); 

希望帮助