谷歌搜索引擎中的自动过滤器应用程序

我有一个城市模型，并有81个城市在这个模型中，只有db字段是名称。谷歌搜索引擎中的自动过滤器应用程序

我希望用户能够从导航栏中的下拉列表中选择一个城市，但用户应该能够通过在开头输入几个字母来快速过滤这些城市。我想要做的确切的例子是在这个网站：www.dabble.co

我不知道我应该遵循哪种方式来做到这一点。任何想法都是很好的。

2017-05-27 Enis D.

您将需要使用AJAX做类似的事情。选择框的Rails options_from_collection_for_select方法会给你第一个字母。这对于81个城市来说可能就足够了。 –

如果您使用的是JQuery，则有http://selectize.github.io/selectize.js/，它有国家选择栏的示例。
您想要在呈现表单的控制器中创建可访问的城市集合。
例如

def new 
    @cities = City.all 
end

您可以轻松地用下面的助手添加相应<select>表单标签：

<%= select_tag("cities", 
      options_from_collection_for_select(@cities, 'id', 'name'), 
      id: "selectize_cities" # sets the id of the select tag 
)%>

根据你的Javascript + Rails的设置，需要你可以添加selectize.js的所有组件后到您的JavaScript文件

$("#selectize_cities").selectize();

如果您想要手动实现这个（没有jQuery的），一种方式可以将数据传递到div标签在HTML查看和访问它使用JavaScript

<%= div.tag(id: "selfmade", data_cities: @cities.to_json)%> #tag helper 
const cities = JSON.parse(document.querySelector("#lol").getAttribute('data_cities')); //plain js

还有YouTube上Railscasts“简单的搜索”，这应该帮助你进一步移动！

来源

2017-05-27 21:53:15 Niklas

谷歌搜索引擎中的自动过滤器应用程序

回答

相关问题