下拉菜单使用Javascript OnChange对MySQL查询进行排序？

以下是我的预览。我想要做的是，当有人将下拉改为“Cooper”，然后只有Cooper品牌的轮胎将显示，它将不得不更新我的MySQL查询。如果他们将其更改回“所有轮胎品牌”，那么它会快速刷新并显示其中的每一个。下拉菜单使用Javascript OnChange对MySQL查询进行排序？

是这样的可能吗？如果有人能指引我在正确的方向，我会非常感激。

谢谢！

enter image description here

来源

2011-09-27 Drew

如果您从数据库第一视图加载*所有品牌*（可能是所有记录），为什么在过去的时间里混淆SQL。只需隐藏/显示您想要“过滤”的行。这将最终减少您所做的数据库呼叫总数，并应提高性能。 – rlemon

这也可以，我只是寻找最好的方式。如果我这样做，那么我的分页会陷入底部？ – Drew

不一定。只需编写分页以显示隐藏适用的行。我希望我有一个工作的例子，我在一张客户端软件的小桌子上这样做。如果你希望我能帮助你。 – rlemon

$("#selectMenuId").bind("change", function(event) { 
    var selectedID = event.target.value; 
    $.post("path/to/your/serverSide.php", { 
     selectionID: selectedID 
    }, function(data) { 
     $("#myContainer").html(data); 
    }); 
});

而且在serverSide.php 你会想要做这样的事情

if(isset($_POST["selectionID"])) { 
    $sql = "SELECT * FROM someTable WHERE category_id = " . $_POST["selectionID"] . "; 
    // run your query, build your new results, echo them back. 
}

基本ID是您所选择的值传递给服务器端网页，运行查询与（我会假设某种类别ID）价值的数据库，建立你的新结果集并返回它。不知道你目前如何建立清单，我无法进一步提供帮助。

编辑要显示加载器，你可以做这样的事情？

$("#selectMenuId").bind("change", function(event) { 
    var selectedID = event.target.value; 
    var container = $("#myContainer"); 
    container.html("Loading..."); 
    $.post("path/to/your/serverSide.php", { 
     selectionID: selectedID 
    }, function(data) { 
     container.html(data); 
    }); 
});

或者你可以有一个加载GIF一个覆盖，只是$（ “＃loadingLayer”）。显示（）/。隐藏（）来。

至于默认选择..你可以（使用你的ServerSide语言）在页面上呈现默认视图。或者你可以把它通过JS收集你有你的结果，其余以同样的方式...只是等待列表加载并触发“变”

$("#selectMenuId").bind("change", function(event) { 
    var selectedID = event.target.value; 
    var container = $("#myContainer"); 
    container.html("Loading..."); 
    $.post("path/to/your/serverSide.php", { 
     selectionID: selectedID 
    }, function(data) { 
     container.html(data); 
    }); 
}).trigger("change");

希望这有助于！

来源

2011-09-27 14:52:18 rlemon

是否有可能没有单独的页面，serverSide.php？当我的MySQL查询位于自己的页面上时，我总是遇到问题。 – Drew

其实我搞定了！哇谢谢一堆。有没有办法在等待时显示AJAX加载器？这需要几秒钟，我只想让他们知道它即将到来。 – Drew

是的，只是一个装载机，然后唯一的另一件事是，当我第一次去页面它不加载任何东西..我必须选择一个下拉，然后选择“所有轮胎品牌”来查看它们。 – Drew

当然，这是可能的。

您需要为弹出窗口指定一个javascript事件侦听器。当访问者从弹出窗口中选择一个项目时，您可以使用AJAX调用向服务器上的Web服务请求显示哪些项目。（您选择的Javascript框架 - jQuery，Prototype或其他 - 将会对此有所帮助。）然后，您将DOM中的搜索结果项目替换为Web服务返回的项目。

这是一个高层次的概念视图。如果你想了解更多细节，这里的an article非常接近你所需要的。

来源

2011-09-27 13:08:00

下拉菜单使用Javascript OnChange对MySQL查询进行排序？

回答

相关问题