リアルタイムの検索を実現

4204 ワード
JavaScript Ajax linux python Rails
[size=large][size][color=green]リアルタイム検索を実現
a live search
あなたのページでリアルタイムで検索したい場合は、異なるキーワードを入力すると、クエリーの解果が変わります.
railsのajaxアシストメソッドを使用してリアルタイム検索を作成
データベースの移行
db/migrate/001_create_books.rb:

class CreateBooks < ActiveRecord::Migration
  def self.up
    create_table :books do |t|
      t.column :title, :string
    end

    Book.create :title => 'Perl Best Practices'
    Book.create :title => 'Learning Python'
    Book.create :title => 'Unix in a Nutshell'
    Book.create :title => 'Classic Shell Scripting'
    Book.create :title => 'Photoshop Elements 3: The Missing Manual'
    Book.create :title => 'Linux Network Administrator's Guide'
    Book.create :title => 'C++ Cookbook'
    Book.create :title => 'UML 2.0 in a Nutshell'
    Book.create :title => 'Home Networking: The Missing Manual'
    Book.create :title => 'AI for Game Developers'
    Book.create :title => 'JavaServer Faces'
    Book.create :title => 'Astronomy Hacks'
    Book.create :title => 'Understanding the Linux Kernel'
    Book.create :title => 'XML Pocket Reference'
    Book.create :title => 'Understanding Linux Network Internals'
  end

  def self.down
    drop_table :books
  end
end

次にscript.aculo.us and Prototype
レイアウトに含める.
app/views/layouts/books.rhtml:

<html>
  <head>
    <title>Books</title>
    <%= javascript_include_tag :defaults %>
  </head>
  <body>
    <%= yield  %>
  </body>
</html

index and searchメソッドを含むコントローラを作成します.searchメソッドはindexビューから送られてきたajax呼び出しに応答する.
app/controllers/books_controller.rb:

class BooksController < ApplicationController

  def index
  end

  def get_results
    if request.xhr?
      if params['search_text'].strip.length > 0
        terms = params['search_text'].split.collect do |word|  
          "%#{word.downcase}%" 
        end     
        @books = Book.find(
          :all,   
          :conditions => [
            ( ["(LOWER(title) LIKE ?)"] * terms.size ).join(" AND "),
            * terms.flatten
          ]       
        )       
      end     
      render :partial => "search" 
    else    
      redirect_to :action => "index" 
    end
  end
end

index.rhtmlビューにはクエリーフィールドが表示され、observe_が使用されます.FieldというJavaScriptアシストメソッドは、フィールドにオブジェクトを定義します.　 
app/views/books/index.rhtml:

<h1>Books</h1>

Search: <input type="text" id="search_form" name="search" />

<img id="spinner" src="/images/indicator.gif" style="display: none;" />  

<div id="results"></div>

<%= observe_field 'search_form',
  :frequency => 0.5, 
  :update => 'results',
  :url => { :controller => 'books', :action=> 'get_results' },
  :with => "'search_text=' + escape(value)",
  :loading => "document.getElementById('spinner').style.display='inline'",
  :loaded => "document.getElementById('spinner').style.display='none'" %>

最後に、ローカルテンプレートを作成し、クエリーの結果をブックタイトルのリストとして表示します.
app/views/books/_search.rhtml:

<% if @books %>
  <ul>
    <% for book in @books %>
      <li>    
        <%= h(book.title) %>
      </li>   
    <% end %>
  </ul>
<% end %>
[/color]
抽象類、密封類及びインタフェースの心得
Goはtimeを採用する.Afterによるタイムアウト制御