Ajax 支持搜索具有多个条件的产品答案

【问题标题】：Ajax enabled search for products with multiple criteriaAjax 支持搜索具有多个条件的产品
【发布时间】：2012-06-05 06:41:12
【问题描述】：

想要在这个网站上拥有搜索功能

每当用户过滤搜索（选中任何复选框）时，它都会相应地更新结果，可以理解为ajax过滤器。

但同时，查询字符串也反映了变化，这有助于用户为过滤器搜索添加书签以供以后参考。

通过asp.net/javascript更改它可能会导致页面重新加载..

任何有关实施相同的提示或建议都会非常有帮助..

【问题讨论】：

【解决方案1】：

这可以通过三件事一起完成

1) 正如@Aristos 所说，启用自动回发的复选框

2) Ajax 控制工具包 Modalpopup，它在每次异步回发时自动触发 (http://weblogs.asp.net/ruslan/pages/ajax-update-progress-updateprogress-in-ajax-modal-popup-modalpopupextender .aspx 或http://mattberseth.com/blog/2007/07/modalpopup_as_an_ajax_progress.html)

3) 历史记录点 (http://msdn.microsoft.com/en-us/library/cc488548.aspx)

如果你不想使用 jQuery，这完全可以不使用 jQuery 来完成。

【讨论】：

【解决方案2】：

-- 对于第一部分，他有一组带有自动回发的复选框列表。

在每次回帖中，列表都会根据选中的复选框进行更新。

到目前为止一切都很简单，很酷的是有一个很好的交互界面（用 javascript 和 jQuery 制作）。

-- 关于第二部分，它如何更改 url 以便可以在不重新加载页面的情况下成为书签。这里的技巧是将参数放在锚点# 之后，例如：

/new/search.aspx#budget=2

使用锚# 页面不会重新加载并保持原样。因此，当有人单击复选框时，通过 javascript 也会更新 url，但仅更新 # 之后的内容，因此页面保持原样而无需完全重新加载。

现在# 后面的参数无法读取后面的代码，只能通过javascript 读取。

因此，当您为此页面添加书签并直接转到例如/new/search.aspx#budget=2 时，javascript 会读取# 之后的内容并将其转换为命令，选中相应的复选框，并要求刷新内容。所有这些都只能通过 javascript 完成。

我看到这是使用 jQuery history plugin 作为此架构的助手。

# 之后的参数的相同技巧是在亚马逊上完成的，当您在目录上导航时，从一个页面到另一个页面。

-- 一个更聪明的技巧是打开一个完整的页面等待，因此用户不能与页面交互，直到页面再次准备好。如果不这样做，并且用户在复选框上快速单击两次，那么这可能会导致更新面板上的整页回帖，这可能会丢失以前的设置。

【讨论】：