Echo php數組結果在while循環之外 - 使用jquery更新html div

Question

好，所以這個一直在絞盡腦汁。我有以下頁面product_main.php。這是我的應用程序的主要產品顯示頁面。我正在使用以下代碼在另一個頁面上顯示基於特定類別鏈接的產品。這工作得很好，並顯示根據其類別產品：

<?php 

    $q = $_GET['cat']; 

    include 'db_connect.php'; 

    $result = mysqli_query($con, "SELECT * FROM product_info WHERE ProductCat= '".$q."'"); 

    while($row = mysqli_fetch_array($result)) { 

     $pro_id = $row['ProductID']; 
     $pro_tit = $row['ProductTitle']; 
     $pro_des = $row['ProductDesc']; 
     $pro_img = $row['ProductImg']; 

     echo " 

     <div class='product-display'> 
      <img id='prodImage' src='Images/$pro_img.jpg' alt='product photo'> 
      <h3>$pro_tit</h3> 
      <h3>$pro_des</h3> 
     </div> 

     "; 

    } 
?> 

現在我想要做的就是添加一個過濾器下拉菜單選擇不同的類別，而在同一頁面上。我有以下代碼獲取function_load_product.php的輸出和更新我的網頁上的div元素：

<script> 

function selectCat(str) { 
if (str == "") { 
    document.getElementById("prodArea").innerHTML = ""; 
    return; 
} else { 
    if (window.XMLHttpRequest) { 
     // code for IE7+, Firefox, Chrome, Opera, Safari 
     xmlhttp = new XMLHttpRequest(); 
    } else { 
     // code for IE6, IE5 
     xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); 
    } 
    xmlhttp.onreadystatechange = function() { 
     if (this.readyState == 4 && this.status == 200) { 
      document.getElementById("prodArea").innerHTML = this.responseText; 
     } 
    }; 

    xmlhttp.open("GET","function_load_product.php?cat="+str,true); 
    xmlhttp.send(); 
    } 
} 

</script> 

這又工作在「試圖」從function_load_product.php搶輸出的罰款。

我認爲使用相同的代碼按主顯示頁 - 我會得到相同的功能 - 但我似乎遇到了麻煩任何顯示。

我想我已經把範圍縮小到一個範圍的問題 - 與作爲echo語句包含在while循環中Jquery的不返回任何東西。

我已經嘗試下面的代碼，因爲這做的另一個項目從PHP文件返回結果的表到HTML文檔和更新DIV爲我工作。可悲的是，這也不管用！ - 它只是返回一個空div到主頁：

<?php 

    $q = $_GET['cat']; 

    include 'db_connect.php'; 

    $result = mysqli_query($con, "SELECT * FROM product_info WHERE ProductCat= '".$q."'"); 

echo "<div class='product-display'>"; 

while($row = mysqli_fetch_array($result)) { 

     echo "<img id='prodImage' src='Images/" . $row['ProductImg'] . ".jpg' alt='product photo'>"; 
     echo "<h3>" . $row['ProductTitle'] . "</h3>"; 
     echo "<h3>" . $row['ProductDesc'] . "</h3>"; 

    } 

    echo "</div>"; 

?> 

不是真的知道到什麼地方去，此地說實話，我有偷偷摸摸的懷疑，我接近全「的產品過濾器」的想法在最高效方式可能！任何指針表示讚賞....

編輯 - 哦，我也嘗試使用全局變量，然後呼應while循環之外的結果 - 但它只是返回一個空的結果到主產品頁面。

正確答案： 一直以來都是小事！這是選項的代碼，我有：

<div class="product-filter-bar"> 
     <div> 
      <form class="product-filter-cat" onchange="selectCat(this.value)"> 
      <select> 
       <option>Select a category:</option> 
       <option>Top</option> 
       <option>Jacket</option> 
       <option>Dress</option> 
       <option>Jeans</option> 
       <option>Skirt</option> 
      </select> 
      </form> 
     </div> 
    </div> 

但這應該是：

<div class="product-filter-bar"> 
     <div> 
      <form> 
      <select class="product-filter-cat" onchange="selectCat(this.value)"> 
       <option>Select a category:</option> 
       <option>Top</option> 
       <option>Jacket</option> 
       <option>Dress</option> 
       <option>Jeans</option> 
       <option>Skirt</option> 
      </select> 
      </form> 
     </div> 
    </div> 

**我只是有函數調用附着於「形式」標籤，並應該有它附加到「選擇」標籤。

Answer 1

嘗試使用在你的瀏覽器開發者工具做對Ajax請求的響應控制檯日誌。這將允許您查看是否有任何內容正在返回並縮小範圍是PHP還是Javascript。

我的Java腳本的是生鏽，但你肯定xmlhttp.onreadystatechange是否正常工作？