title: How to add live search to Rails 4.2?
body: <p>I've been attempting to create a simple search form which responds to AJAX on my Rails 4.2 application. I've attempted every tutorial I could find, but still to no avail.</p>
  
  <ul>
  <li><a href="http://railscasts.com/episodes/240-search-sort-paginate-with-ajax" rel="nofollow noreferrer">http://railscasts.com/episodes/240-search-sort-paginate-with-ajax</a></li>
  <li><a href="http://aymeric.gaurat.net/2010/how-to-develop-live-search-textbox-in-ruby-on-rails/" rel="nofollow noreferrer">http://aymeric.gaurat.net/2010/how-to-develop-live-search-textbox-in-ruby-on-rails/</a></li>
  <li><a href="https://stackoverflow.com/questions/24255691/ruby-on-rails-live-search-filtering">Ruby on Rails Live Search (Filtering)</a>,</li>
  <li><a href="https://www.youtube.com/watch?v=EqzwLUni2PM" rel="nofollow noreferrer">https://www.youtube.com/watch?v=EqzwLUni2PM</a>)</li>
  </ul>
  
  <p>This is my search method:</p>
  
  <pre class="lang-html prettyprint-override"><code>  def self.search(search)
      search ? where('name LIKE ?', "%#{search}%") : all
    end
  </code></pre>
  
  
  
  <p>My index action on the controller:
  </p>
  
  <pre><code>  # GET /ticket_types
    # GET /ticket_types.json
    def index
      @ticket_types = TicketType.search(params[:search]).order(sort_column + " " + sort_direction).paginate(per_page: 10, page: params[:page])
      respond_to do |format|
        format.html {render 'index'}
        format.json {render json: @ticket_types.map(&amp;:name)}
      end
    end
  </code></pre>
  
  
  
  <p>My filter:
  </p>
  
  <pre><code>  &lt;form&gt;
      &lt;fieldset&gt;
        &lt;legend&gt;Filter&lt;/legend&gt;
          &lt;%= form_tag path, remote: true, method: 'get', id: id do %&gt;
            &lt;%= hidden_field_tag :direction, params[:direction] %&gt;
            &lt;%= hidden_field_tag :sort, params[:sort]%&gt;
            &lt;p&gt;
              &lt;%= text_field_tag :search, params[:search], id: 'filter_search_autocomplete', data: {autocomplete_source: ticket_types_path} %&gt;
              &lt;%= render 'button_submit', name: nil, id:"search_button" %&gt;
            &lt;/p&gt;
          &lt;% end %&gt;
        &lt;/fieldset&gt;
      &lt;/form&gt;
  </code></pre>
  
  <p>
  The submit button:</p>
  
  <pre class="lang-html prettyprint-override"><code>  &lt;%= submit_tag "Search", name: name, class: 'button', id: id, remote: true %&gt;
  </code></pre>
  
  
  
  <p>My ticket_types.coffee
  </p>
  
  <pre><code>jQuery -&gt;
    $('#filter_search_autocomplete').autocomplete
    source: $('#filter_search_autocomplete').data('autocomplete-source')
  </code></pre>
  
  
  
  <p>And my index partial:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;p id="notice"&gt;&lt;%= notice %&gt;&lt;/p&gt;
  
  &lt;%= render 'registry_filter', path: ticket_types_path, id: "ticket_search_filter" %&gt;
  &lt;%= render 'ticket_types' %&gt;
  &lt;br&gt;
  &lt;section id="content-area"&gt;&lt;/section&gt;
  &lt;div&gt;
    &lt;%= render 'button_link', button_name: "Create", path: new_ticket_type_path, id: 'create' %&gt;
    &lt;%= render 'button_link', button_name: "Back", path: ticket_types_path, id: 'back_button' %&gt;
  &lt;/div&gt;
  </code></pre>
  
  
  
  <p>Any ideas on how could I have a livesearch box like Facebook? For example, I'd like that each time the user types a letter on the box, it shows about 5 results of registries that contain the given word, and then use this search asset as a partial to be able to use on other models of the application. Thanks in advance!</p>