使用下拉列表动态更改 PHP Mysql 查询答案

【问题标题】：Change PHP Mysql query dynamically using dropdown list使用下拉列表动态更改 PHP Mysql 查询
【发布时间】：2015-12-19 23:22:23
【问题描述】：

我有一个下拉列表需要动态更改以下 php mysql 查询。特别是 WHERE 部分。所以下拉菜单有 CATERING、ENTERTAINMENT、VACATIONS 等。所以如果有人选择 VACATIONS，下面的查询将用 tblclients.category = 'Vacations' 交换娱乐，页面上的结果会发生变化。

PHP

$query = mysql_query("SELECT * FROM tblClients  WHERE tblclients.package =  'standard' and tblclients.category = 'Entertainment' LIMIT 0, 9", $connection);

JQUERY - 我知道如何让以下脚本知道选择了哪个下拉列表选项，但只知道如何显示/隐藏 DIV。

  <script>  
$(document).ready(function(){

    $('.dropdown .Catering').click(function(){
    $('#page_featured_container').show();

  }); 
    $('.dropdown .Entertainment').click(function(){
    $('#page_featured_container').show();

  }); 

        $('.dropdown .Vacations').click(function(){
    $('#page_featured_container').show();

  }); 
  </script>

HTML仅供参考，我的下拉列表如下所示。

    <section class="main">
        <div class="wrapper">
            <div id="dd" class="wrapper-dropdown-3" tabindex="1">
                <span>View By Category</span>
                <ul class="dropdown">
            <?php while ($rows = mysql_fetch_array($query_category)) { ?>
                    <li><a class="<?php echo $rows['category']; ?>"><?php echo $rows['category']; ?></a></li>
            <?php } ?>  
            </ul>
            </div>
        </div>
    </section>

所以，理论上，我的 JQUERY 会喜欢这个...

  <script>  
$(document).ready(function(){

    $('.dropdown .Catering').click(function(){
    CHANGE PHP WHERE STATEMENT AND DISPLAY NEW RESULTS.

【问题讨论】：

标签： javascript php jquery html mysql

【解决方案1】：

您可以通过使用带有 jquery 的 Ajax 查询来执行此操作：

$(".dropdown .Catering").on("click", function()
{
   // getting the classname of clicked category to write your query
   var category = $(this).attr("class");
   $.ajax
   ({
       url:"controller.php?category="+category, // supposed you grab the query like that
       method: "get", // or post as you want
       success: function(data) // where data is the php returned newest list
       {
           // this line will overwrite the html content of 'page_featured_container'
           $("#page_featured_container").html(data);
       }
   });
});

如果你喜欢使用 POST 方法您必须添加：

method: "post",
data: {category: category},

【讨论】：