每天一剂Rails良药之Lightning-Fast JavaScript Auto-completion

阅读更多

Gmail中你输入收信人地址时会自动搜索并提示，速度很快，因为Gmail不是每次都从后台搜索，而是一开始就
把地址加载到页面中，然后在页面中匹配并搜索。让我们看看怎样在Rails里实现它。

1，准备搜索数据
我们创建app/controllers/book_controller.rb:

class BookController < ApplicationController

  def authors_for_lookup
    @authors = Author.find(:all)
    @headers['content-type'] = 'text/javascript'
    render :layout => false
  end

end

这里我们设置headers的content-type为text/javascriipt。

2，封装JavaScript数据
我们创建返回的页面app/views/book/authors_for_lookup.rhtml:

var authors = new Array(<%= @authors.size%>);

<% @authors.each_with_index do |author, index|%>
    authors[<%= index %>] = "<%= author.name %>";
<% end %>

我们在该rhtml中直接写javascript代码，并用Ruby代码动态取得和填充authors数据

3，写搜索页面
如app/views/book/search_page.rhtml:

    
        <%= javascript_include_tag :defaults %>
        
        
    
    
        Author Search
        
        

        
        <%= javascript_tag("new Autocompleter.Local('author_lookup',
                                                      'author_lookup_auto_complete',
                                                      authors,
                                                      {fullSearch: true,
                                                        frequency: 0,
                                                        minChars: 1,
                                                      }
                                                      );") %>
    

Autocompleter.Local在本地(当前页面中)取数据，让我们访问 http://localhost:3000/book/search_page看看效果，很不错哦！