首页 > 解决方案 > 如何使用 AJAX、PHP 和 MySQL 使过滤器协同工作

问题描述

我有一张显示用户列表的表格,我正在尝试使用选择框创建一些过滤器来过滤一些参数。我正在使用我用 AJAX 调用的 PHP 脚本构建此表。当用户单击此选择框之一时,将激活此 AJAX。

这是过滤器:

<div class="col-lg-6">                                
   <select class="form-control filter" name="category" id="category">
       <option>All</option>
       <option>Abraham</option>
       <option>Kevin</option>
       <option>Eric</option>
   </select>                                
</div>   
<div class="col-lg-6">                                
   <select class="form-control filter" name="datePeriod" id="datePeriod">
       <option>Today</option>
       <option>Yesterday</option>
       <option>Last 7 days</option>
       <option>Last month</option>
       <option>Last year</option>
   </select>                                
</div>
<div class="col">
   <div id="output"></div>
</div>

这是 AJAX:

$(document).ready(function(){
    $('.filter').each(function () {
        $(this).change(function(){ 
            var filters = $(this).val(); 
            var dataString = "filters="+filters;

            $.ajax({
                type: "GET", 
                url: "processes/filters.php", 
                data: dataString, 
                success: function(result){ 
                    $("#output").html(result);
                }
            });
        });            
    });
    $("#datePeriod").trigger("change");
});

这是我的 PHP 代码:

<?php

    //Getting $datePeriod value for query
    if(isset($_GET['filters']) && $_GET['filters'] == "Today" && $_GET['filters'] == "All"){
        $datePeriod = 'AND DATE(VISIT_DATE) = CURDATE()';
        $category = "";
    }
    if(isset($_GET['filters']) && $_GET['filters'] == "Yesterday"){
        $datePeriod = 'AND VISIT_DATE >= DATE(NOW()) - INTERVAL 1 DAY';     
    }
    if(isset($_GET['filters']) && $_GET['filters'] == "Last 7 days"){
        $datePeriod = 'AND VISIT_DATE >= DATE(NOW()) - INTERVAL 7 DAY';
    }
    if(isset($_GET['filters']) && $_GET['filters'] == "Last month"){
        $datePeriod = 'AND VISIT_DATE >= DATE(NOW()) - INTERVAL 1 MONTH';
    }
    if(isset($_GET['filters']) && $_GET['filters'] == "Last year"){
        $datePeriod = 'AND VISIT_DATE >= DATE(NOW()) - INTERVAL 1 YEAR';
    }

    //Getting $category value for query
    if(isset($_GET['filters']) && $_GET['filters'] == "All"){
        $category = "";
    }
    if(isset($_GET['filters']) && $_GET['filters'] == "Abraham"){
        $category = "AND VISIT_REASON='Abraham'";
    }
    if(isset($_GET['filters']) && $_GET['filters'] == "Kevin"){
        $category = "AND VISIT_REASON='Kevin'";
    }
    if(isset($_GET['filters']) && $_GET['filters'] == "Eric"){
        $category = "AND VISIT_REASON='Eric'";
    }

    include('conn.php');

    mysqli_set_charset($conn, 'utf8');

    $orderBy = 'ORDER BY VISIT_DATE DESC';

    $sql = "SELECT * FROM queue WHERE ATTENDED='1' ".$category." ".$datePeriod." ".$orderBy." ";

    $result = mysqli_query($conn, $sql);

    //$ID = 'ID';
    $GUEST_NAME = 'GUEST_NAME';
    $GUEST_PHONE = 'GUEST_PHONE';
    $VISIT_REASON = 'VISIT_REASON';
    $VISIT_DATE = 'VISIT_DATE';

    echo '<table class="table table-striped">';
    echo "<tr>";
    //echo '<th scope="col">ID</th>';
    echo '<th scope="col">Name</th>';
    echo '<th scope="col">Phone</th>';
    echo '<th scope="col">Attended by</th>';
    echo '<th scope="col">Visit Date</th>';
    echo "</tr>";

    if (mysqli_num_rows($result) > 0) {

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

            echo "<tr>";
            //echo "<td>$row[$ID]</td>";
            echo "<td>$row[$GUEST_NAME]</td>";
            echo "<td>$row[$GUEST_PHONE]</td>";
            echo "<td>$row[$VISIT_REASON]</td>";
            echo "<td style='text-transform:uppercase;'>".date('M-d-Y g:i a', strtotime(str_replace('-','/', $row['VISIT_DATE'])))."</td>";
            echo "</tr>";

        }

    } else {
        echo "<td style='text-transform: none;'>No records to show.</td>";
    }

    echo '</table>';

    mysqli_close($conn);

?>

我的问题是我无法弄清楚如何建立正确的条件,以便两个过滤器可以一起工作。我需要当用户选择一个过滤器时,考虑到另一个过滤器的值,查询会自行构建。

当我选择类别过滤器时,我得到“未定义的变量:datePeriod”。当我选择 datePeriod 过滤器时,我得到“未定义的变量:类别”。

我不知道我是否做错了。也许我没有以正确的方式构建查询。我将不胜感激任何帮助或指导。

标签: phpmysqlajax

解决方案


每次更改时,您都需要发送这两个过滤器:

JS:

$(document).ready(function(){
    $('.filter').change(function(){ 
        $.ajax({
            type: "GET", 
            url: "processes/filters.php", 
            data: {
                category: $('#category').val(),
                datePeriod: $('#datePeriod').val(),
            },
            success: function(result){ 
                $("#output").html(result);
            }
        });
    });            
    $("#datePeriod").trigger("change");
});

PHP:

<?php
if($_GET['category'] == "All"){
    $category = "";
} else if($_GET['category'] == "Abraham"){
    $category = "AND VISIT_REASON='Abraham'";
} else if( $_GET['category'] == "Kevin"){
    $category = "AND VISIT_REASON='Kevin'";
} else if($_GET['category'] == "Eric"){
    $category = "AND VISIT_REASON='Eric'";
} else {
    $category = '';
}

if($_GET['datePeriod'] == "Today"){
    $datePeriod = 'AND DATE(VISIT_DATE) = CURDATE()';
} else if($_GET['datePeriod'] == "Yesterday"){
    $datePeriod = 'AND VISIT_DATE >= DATE(NOW()) - INTERVAL 1 DAY';     
} else if($_GET['datePeriod'] == "Last 7 days"){
    $datePeriod = 'AND VISIT_DATE >= DATE(NOW()) - INTERVAL 7 DAY';
} else if($_GET['datePeriod'] == "Last month"){
    $datePeriod = 'AND VISIT_DATE >= DATE(NOW()) - INTERVAL 1 MONTH';
} else if($_GET['datePeriod'] == "Last year"){
    $datePeriod = 'AND VISIT_DATE >= DATE(NOW()) - INTERVAL 1 YEAR';
} else {
    $datePeriod = '';
}
// the rest of the file

推荐阅读