Question

我有这个滚动菜单：

<form class="woocommerce-ordering" method="get">
<select name="orderby" class="orderby">
<option value="menu_order" >Default sorting</option>
<option value="popularity"  selected='selected'>Sort by popularity</option>
<option value="rating" >Sort by average rating</option>
<option value="date" >Sort by newness</option>
<option value="price" >Sort by price: low to high</option>
<option value="price-desc" >Sort by price: high to low</option>    
</select>
<input type="hidden" name="attest" value="true" /></form>

我需要它来使用按钮来改变价值。如何通过使用按钮将数据发送到网址，例如“按价格排序：从低到高”？

谢谢！

Answer 1

如果您想要真正的提交按钮，可以使用

<input type="submit" name="orderby[menu_order]" value="Default sorting">
<input type="submit" name="orderby[popularity]" value="Sort by popularity">

然后使用key($_GET['orderby'])获取值（在其他检查之后，如值存在，是数组等）。

<强>更新

按价格排序后，我的网址应如下所示：

http://example.com/folder/?orderby=price&attest=true

使用纯HTML（并且对参数处理没有服务器端更改），当您愿意设置参数时，只能在使用orderby=price按钮时在查询字符串中获取input type=submit值为显示值（value=）。

您可以切换到button元素，

<button type="submit" name="orderby"
  value="price">Sort by price: low to high</button>

但请注意，在旧浏览器中支持此功能（特别是IE＆lt; = 6，我认为）很糟糕。

使用纯链接，如果预先知道值attest=true（从上一个表单提交），您可以在服务器端动态地将其构建到URL中，

<a href="?orderby=price&attest=true">Sort by price: low to high</a>

（然后使用CSS将这些链接格式化为“按钮”。）

但是这样，您无法传递用户可能想要选择的任何其他参数（如果您的表单提供了其他更改/选择的选项）。

如果您还需要更多 - 那么您将不得不使用JavaScript或者必须愿意调整您的服务器端参数处理（如果您不想操作，可能会使用mod_rewrite来完成实际的脚本代码）。

Answer 2

不确定这是否是您的意思，但如果您希望在用户单击下拉菜单中的选项后立即更新数据，则此jquery代码将起到作用：

$('.orderby').change(function() {
    var value = $(this).val();

    alert(value);

    /*
    Run ajax here to make a call to a php script that
    takes the value parameter and returns the data in
    the correct order
    */
});

如何使用按钮更改选项值并将数据发送到url？

2 个答案: