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>

这在尝试＆＃39;从 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>";

?>

不确定从哪里开始并且说实话我怀疑我正在接近整个产品过滤器＆＃39;以最低效的方式提出想法！任何指针都赞赏....

编辑 - 哦，我也尝试使用全局变量，然后在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>

**我只是将函数调用附加到＆＃34;表单＆＃34;标签，应该已经附加到＆＃34;选择＆＃34;标签

Answer 1

尝试使用浏览器中的开发人员工具对ajax请求的响应执行控制台日志记录。这将允许您查看是否正在返回任何内容，并缩小您的PHP或您的Javascript。

我的Java脚本生锈但你确定xmlhttp.onreadystatechange工作正常吗？

Echo php数组结果外循环 - 使用jquery更新html div

1 个答案: