Question

在我的应用程序中，用户从自动填充文本字段中选择火车站。由于没有很多火车站（~100），我更喜欢根据客户端阵列的内容自动完成该字段，而不是每次用户键入一个字符时查询服务器（目标是制作自动完成更具响应性。）

我的问题是如何以可维护，非hacky的方式在Rails中执行此操作。我目前的解决方案是将此行放在index.html.erb：

的底部

<%= javascript_tag "var stations = #{Station.all.map {|s| s.name}.to_json}" %>

但这不是很好（首先，我在application.js）工作时必须记住“工作站”变量名称。

Answer 1

您可以制作一个动态生成的Javascript视图文件，类似于how I show here。

基本上如果你有一个控制器动作（例如javascripts控制器站动作）。它可能看起来像这样。

# in controllers/javascripts_controller.rb
def stations
  @stations = Station.all
end

然后你可以制作一个像这样的JavaScript视图文件......

// in views/javascripts/stations.js.erb
var stations = <%= @stations.map(&:name).to_json %>;
// ...

该javascript文件可以包含您想要的任何JavaScript，因此您可以在那里移动一些application.js代码。然后，您可以像任何其他javascript文件一样包含此内容。

<%= javascript_include_tag 'stations' %>

这假设它位于'javascripts'路径下，如果你有一个javascripts控制器就是这种情况。否则你将不得不通过完整的路径。

这确实有一个缺点，就是向Rails应用程序再提出一个请求，但你可以将页面缓存添加到该js动作中以优化它。

Answer 2

在你的application.js中，在文档就绪时，执行ajax调用以使用值填充本地数组。

document.observe("dom:loaded", function() {
  var stations;
  new Ajax.Request(url, {
    method: 'get',
    onSuccess: function(transport) {
      stations = transport.responseText;
    }
  });
});

我的示例可能效果不佳（因为我现在使用jQuery到jrails），但它应该给人留下正确的印象。

在Rails中使用本地数据自动完成

2 个答案: