0

假设我有某种数据网格,我想在这个站点中添加几个链式过滤器: http ://www.yelp.com/search?find_desc=bar&ns=1&find_loc=Minneapolis%2C+MN (排序方式,距离,价格等)。

每次用户单击过滤器链接时,它都会相应地更新数据网格的内容。但我还需要更新其他过滤器中的链接以考虑更改。例如:如果我更改订单字段,我需要?order_field=x在所有其他过滤器链接中添加/更新。

您认为实现这种情况的最佳方法是什么?我是否应该创建一个函数,当单击过滤器链接时,它会更新所有其他过滤器的查询字符串参数?或者使用隐藏字段来记录每个过滤器中选择的选项?

如果可能的话,我想要一个可重复使用的解决方案。

4

1 回答 1

0

由于数据是通过 AJAX 加载的,因此不应该有任何要更新的链接 - 至少如果您指的是 anchor tags 则不会<a>。您甚至不需要将过滤器存储在隐藏字段中。

我会将所有过滤器存储为 JSON 对象。根据 API 的设置方式,您可能必须将 JSON 对象转换为 API 可用的对象,或者您甚至可以直接在$.ajax请求中传递 JSON 对象。

id="price"此示例代码假定您在标记中有一个文本框。我故意convert_filters_to_parameters留空,因为您没有提供有关 API 的任何详细信息。jQuery 会依次将这些参数序列化为 GET 或 POST 请求,然后再将它们发送出去。

var filters = { 
    distance:null,
    price:null,
    sortBy:'distance'
}

//this assumes you have a textbox with id="price" 
$('#price').changed(function()
{
    filters.price = $(this).val();
    refresh_data();
});

function refresh_data()
{
    var parameters = convert_filters_to_parameters(filters);
    $.ajax('/my_api', 
            {
                //i left out a lot of properties here for brevity
                data: parameters,
                success: function(response) { alert(response); }
            });
}
于 2011-10-05T19:22:32.947 回答