Question

我是PHP和SQL的新手。我创建了一个显示sql数据库输出的html表。现在我想创建一个过滤器内容列，允许用户根据通过过滤器表单提交的值过滤表内容。这是代码

<div class="filter">
    <label>Stream:</label>
    <select name="stream" form="filtersubmit" required>
        <option value="">Select</option>
        <option value="AB">AB</option>
        <option value="BC">BC</option>
        <option value="CD">CD</option>
    </select>
    <label>College:</label>
    <select name="college" form="filtersubmit">
        <option value="">Select</option>
        <option value="XY">XY</option>
        <option value="YZ">YZ</option>
    </select>

    <form id="filtersubmit">
        <input type="submit" value="Filter">
    </form>
</div>
<div class="feed">

<?php

$conn4 = new mysqli("127.0.0.1", "root", "", "signup");
$hfeed = "SELECT id,college,stream ,price FROM items";
$resfeed = $conn4->query($hfeed);

echo "<table class='table table-hover'>";
echo "<thead><tr><th>College</th><th>Stream</th><th>Price</th></tr></thead>";
if ($resfeed->num_rows > 0) {
    while ($row = $resfeed->fetch_assoc()) {
        echo "<tbody><tr><td>" . $row["College"] . "</td><td>" . $row["stream"] . "</td><td>" . $row["price"] . "</td></tr></tbody>";
    }
} else {
    echo "No data found!";
}

echo "</table>";

我正在使用表单类型过滤器部分，这是正确的方法吗？我应该使用什么，以便在选择过滤器时更新内容而无需重新加载页面。我应该使用JSon和AJAx或Jquery输出我的sql表。我不知道jquery，所以对某些代码的任何帮助都会很有用。

Answer 1

您可以使用JQuery POST执行此操作。请尝试以下代码。

<div class="filter">
    <label>Stream:</label>
    <select name="stream" id="stream" form="filtersubmit" required onchange="filterAct()">
        <option value="">Select</option>
        <option value="AB">AB</option>
        <option value="BC">BC</option>
        <option value="CD">CD</option>
    </select>
    <label>College:</label>
    <select name="college" id="college" form="filtersubmit" onchange="filterAct()">
        <option value="">Select</option>
        <option value="XY">XY</option>
        <option value="YZ">YZ</option>
    </select>

    <form id="filtersubmit">
        <input type="button" value="Filter" onclick="filterAct()">
    </form>
</div>
<div class="filterdata"></div>

<script>
    function filterAct(){
        var stream =$('#stream').val();
        var college =$('#college').val();

        $.post('filter.php', { stream: stream, college : college}, 
            function(retData){
                $('#filterdata').html(retData);
            });
    }


</script>


filter.php



<?php

$conn4 = new mysqli("127.0.0.1", "root", "", "signup");

/**** Please add this ****/
$where = "1";
if(isset($_POST)){

  if($_POST['stream'])  {
    $where.=" AND stream ='".$_POST['stream']."'";
  } 

   if($_POST['college'])    {
    $where.=" AND college ='".$_POST['college']."'";
  }

}
/*** End ***/


$hfeed = "SELECT id,college,stream ,price FROM items".  $where;
$resfeed = $conn4->query($hfeed);

$html="<table class='table table-hover'>";
$html.="<thead><tr><th>College</th><th>Stream</th><th>Price</th></tr></thead>";
if ($resfeed->num_rows > 0) {
    while ($row = $resfeed->fetch_assoc()) {
        $html.="<tbody><tr><td>" . $row["College"] . "</td><td>" . $row["stream"] . "</td><td>" . $row["price"] . "</td></tr></tbody>";
    }
} else {
   $html.= "No data found!";
}

$html.= "</table>";

echo $html;

过滤SQL输出表的内容

1 个答案: