2014-10-31 117 views
0

我需要幫助這個,我不知道爲什麼子貓不會加載。但第一個下拉列表會加載所有查詢。我只是不知道爲什麼它不會與第二個一起工作。依賴下拉不起作用,第二下拉不加載

,這裏是我的index.php

<?php 
include('config.php'); 
$query_parent = mysql_query("SELECT * FROM zipcodes GROUP BY major_area") or die("Query failed: ".mysql_error()); 
?> 
<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Dependent DropDown List</title> 
<script type="text/javascript" src="js/jquery.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 

    $("#parent_cat").change(function() { 
     $(this).after('<div id="loader"><img src="img/loading.gif" alt="loading subcategory" /></div>'); 
     $.get('loadsubcat.php?parent_cat=' + $(this).val(), function(data) { 
      $("#sub_cat").html(data); 
      $('#loader').slideUp(200, function() { 
       $(this).remove(); 
      }); 
     }); 
    }); 

}); 
</script> 
</head> 

<body> 
<form method="get"> 
    <label for="category">Parent Category</label> 
    <select name="parent_cat" id="parent_cat"> 
     <?php while($row = mysql_fetch_array($query_parent)): ?> 
     <option value="<?php echo $row['major_area']; ?>"><?php echo $row['major_area']; ?></option> 
     <?php endwhile; ?> 
    </select> 
    <br/><br/> 

    <label>Sub Category</label> 
    <select name="sub_cat" id="sub_cat"></select> 
</form> 
</body> 
</html> 

,這裏是我的loadsubcat.php

<?php 
include('config.php'); 

$parent_cat = $_GET['parent_cat']; 

$query = mysql_query("SELECT city FROM zipcodes WHERE major_area = {$parent_cat}") or die(mysql_error()); 
while($row = mysql_fetch_array($query)) { 
    echo "<option value='$row[city]'>$row[city]</option>"; 
} 
?> 

請檢查我的代碼,並告訴我哪裏做錯了。它不會爲第二次下拉加載。

+0

是否有出現的任何錯誤? – Rasclatt 2014-10-31 03:42:03

+0

@Rasclatt沒有,但我很確定它與JavaScript有關,我認爲它只能得到id號碼,而我試圖發送major_area的值,但我不知道如何解決它。 – geds13 2014-10-31 03:53:54

+0

是你的加載gif的工作?你的Ajax是否返回正確的HTML? (監控網絡請求,你可以使用螢火蟲或類似的工具)。你認爲這個錯誤可能發生在哪裏? – 2014-10-31 04:27:42

回答

0

試着做一個簡單的AJAX功能:

<script type="text/javascript"> 
    function AjaxCall(ElemVal,PlaceId) { 
      $.ajax({ 
        url: "loadsubcat.php?parent_cat="+$(ElemVal).val(), 
        success: function(result) { 
          $("#"+ PlaceId).html(result); 
         } 
       }); 
     } 

     $(document).ready(function() { 
      $("#parent_cat").change(function() { 
       $("#sub-cat-load").html('<div id="loader"><img src="img/loading.gif" alt="loading subcategory" /></div>'); 
       AjaxCall(this,'sub-cat-load'); 
      }); 
     }); 
</script> 

sub_cat容器

<label>Sub Category</label> 
<!-- NOTICE THIS PART --> 
<div id="sub-cat-load"></div> 

loadsubcat.php

<?php 
include('config.php'); 
// You may want to sanitize this variable 
$parent_cat = $_GET['parent_cat']; 
$query  = mysql_query("SELECT city FROM zipcodes WHERE major_area = {$parent_cat}") or die(mysql_error()); ?> 

<select name="sub_cat" id="sub_cat"><?php 
while($row = mysql_fetch_array($query)) { ?> 
    <option value="<?php echo $row[city]; ?>"><?php echo $row[city]; ?></option><?php 
    } ?> 
</select>