crowdint / rails3-jquery-autocomplete

An easy and unobtrusive way to use jQuery's autocomplete with Rails 3

Project Moved

There has been some confusion around the naming as to where to find the Rails4 version of this gem due to the original naming. With the latest release I have taken the opportunity to address this by moving the official repo.

The official repo is now located at rails-jquery-autocomplete

rails3-jquery-autocomplete

An easy way to use jQuery's autocomplete with Rails 3.

Supports both ActiveRecord, mongoid, and MongoMapper.

Works with Formtastic and SimpleForm

ActiveRecord

You can find a detailed example on how to use this gem with ActiveRecord here.

MongoID

You can find a detailed example on how to use this gem with MongoID here. (Same thing, different branch)

Before you start

Make sure your project is using jQuery-UI and the autocomplete widget before you continue.

You can find more info about that here:

• http://jquery.com/
• http://jqueryui.com/demos/autocomplete/
• http://github.com/rails/jquery-ujs

I'd encourage you to understand how to use those 3 amazing tools before attempting to use this gem.

Installing

Include the gem on your Gemfile

gem 'rails3-jquery-autocomplete'

Install it

bundle install

Rails 3.0.x

Run the generator

rails generate autocomplete:install

And include autocomplete-rails.js on your layouts

javascript_include_tag "autocomplete-rails.js"

Upgrading from older versions

If you are upgrading from a previous version, run the generator after installing to replace the javascript file.

rails generate autocomplete:install

I'd recommend you do this every time you update to make sure you have the latest JS file.

Uncompressed Javascript file

If you want to make changes to the JS file, you can install the uncompressed version by running:

rails generate autocomplete:uncompressed

Rails 3.1.x and higher

Just add it to your app/assets/javascripts/application.js file

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require autocomplete-rails

Usage

Model Example

Assuming you have a Brand model:

class Brand < ActiveRecord::Base
end

create_table :brand do |t|
  t.column :name, :string
end

Controller

To set up the required action on your controller, all you have to do is call it with the class name and the method as in the following example:

class ProductsController < Admin::BaseController
  autocomplete :brand, :name
end

This will create an action autocomplete_brand_name on your controller, don't forget to add it on your routes file

resources :products do
  get :autocomplete_brand_name, :on => :collection
end

Options

:full => true

By default, the search starts from the beginning of the string you're searching for. If you want to do a full search, set the full parameter to true.

class ProductsController < Admin::BaseController
  autocomplete :brand, :name, :full => true
end

The following terms would match the query 'un':

• Luna
• Unacceptable
• Rerun

:full => false (default behavior)

Only the following terms mould match the query 'un':

• Unacceptable

:limit => 10 (default behavior)

By default your search result set is limited to the first 10 records. This can be overridden by specifying the limit option.

:extra_data

By default, your search will only return the required columns from the database needed to populate your form, namely id and the column you are searching (name, in the above example).

Passing an array of attributes/column names to this option will fetch and return the specified data.

class ProductsController < Admin::BaseController
  autocomplete :brand, :name, :extra_data => [:slogan]
end

:display_value

If you want to display a different version of what you're looking for, you can use the :display_value option.

This options receives a method name as the parameter, and that method will be called on the instance when displaying the results.

class Brand < ActiveRecord::Base
  def funky_method
    "#{self.name}.camelize"
  end
end


class ProductsController < Admin::BaseController
  autocomplete :brand, :name, :display_value => :funky_method
end

In the example above, you will search by name, but the autocomplete list will display the result of funky_method

This wouldn't really make much sense unless you use it with the "id_element" attribute. (See below)

Only the object's id and the column you are searching on will be returned in JSON, so if your display_value method requires another parameter, make sure to fetch it with the :extra_data option

:hstore

Added option to support searching in hstore columns.

Pass a hash with two keys: :method and :key with values: the hstore field name and the key of the hstore to search.

e.g autocomplete :feature, :name, :hstore => {:method => 'name_translations', :key => 'en'}

:scopes

Added option to use scopes. Pass scopes in an array. e.g :scopes => [:scope1, :scope2]

:column_name

By default autocomplete uses method name as column name. Now it can be specified using column_name options :column_name => 'name'

json encoder

Autocomplete uses Yajl as JSON encoder/decoder, but you can specify your own

class ProductsController < Admin::BaseController
  autocomplete :brand, :name do |items|
     CustomJSON::Encoder.encode(items)
  end
end

View

On your view, all you have to do is include the attribute autocomplete on the text field using the url to the autocomplete action as the value.

form_for @product do |f|
  f.autocomplete_field :brand_name, autocomplete_brand_name_products_path
end

This will generate an HTML tag that looks like:

<input type="text" data-autocomplete="products/autocomplete_brand_name">

If you are not using a FormBuilder (form_for) or you just want to include an autocomplete field without the form, you can use the autocomplete_field_tag helper.

form_tag 'some/path'
  autocomplete_field_tag 'address', '', address_autocomplete_path, :size => 75
end

Multiple Values Separated by Delimiter

To generate an autocomplete input field that accepts multiple values separated by a given delimiter, add the 'data-delimiter' and :multiple options:

form_for @product do |f|
  f.autocomplete_field :brand_names, autocomplete_brand_name_products_path,
  'data-delimiter' => ',', :multiple => true
end

NOTE: Setting the :multiple option to true will result in the chosen values being submitted as an array. Leaving this option off will result in the values being passed as a single string, with the values separated by your chosen delimiter.

Automatically focus on the first autocompleted item

To have the first item be automatically focused on when the autocomplete menu is shown, add the 'data-auto-focus' option and set it to true.

form_for @product do |f|
	f.autocomplete_field :brand_names, autocomplete_brand_name_products_path,
	'data-auto-focus' => true
end

Now your autocomplete code is unobtrusive, Rails 3 style.

Getting the object id

If you need to use the id of the selected object, you can use the id_element attribute too:

f.autocomplete_field :brand_name, autocomplete_brand_name_products_path, :id_element => '#some_element'

This will update the field with id *#some_element with the id of the selected object. The value for this option can be any jQuery selector.

Changing destination element

If you need to change destination element where the autocomplete box will be appended to, you can use the :append_to option which generates a data-append-to HTML attribute that is used in jQuery autocomplete as append_to attribute.

The :append_to option accepts a string containing jQuery selector for destination element:

f.autocomplete_field :product_name, '/products/autocomplete_product_name', :append_to => "#product_modal"

The previous example would append the autocomplete box containing suggestions to element jQuery('#product_modal'). This is very useful on page where you use various z-indexes and you need to append the box to the topmost element, for example using modal window.

Sending extra search fields

If you want to send extra fields from your form to the search action, you can use the :fields options which generates a data-autocomplete-fields HTML attribute.

The :fields option accepts a hash where the keys represent the Ajax request parameter name and the values represent the jQuery selectors to retrieve the form elements to get the values:

f.autocomplete_field :product_name, '/products/autocomplete_product_name', :fields => {:brand_id => '#brand_element', :country => '#country_element'}

class ProductsController < Admin::BaseController
  def autocomplete_product_name
    term = params[:term]
    brand_id = params[:brand_id]
    country = params[:country]
    products = Product.where('brand = ? AND country = ? AND name LIKE ?', brand_id, country, "%#{term}%").order(:name).all
    render :json => products.map { |product| {:id => product.id, :label => product.name, :value => product.name} }
  end
end

Getting extra object data

If you need to extra data about the selected object, you can use the :update_elements HTML attribute.

The :update_elements attribute accepts a hash where the keys represent the object attribute/column data to use to update and the values are jQuery selectors to retrieve the HTML element to update:

f.autocomplete_field :brand_name, autocomplete_brand_name_products_path, :update_elements => {:id => '#id_element', :slogan => '#some_other_element'}

class ProductsController < Admin::BaseController
  autocomplete :brand, :name, :extra_data => [:slogan]
end

The previous example would fetch the extra attribute slogan and update jQuery('#some_other_element') with the slogan value.

Running custom code on selection

A javascript event named railsAutocomplete.select is fired on the input field when a value is selected from the autocomplete drop down. If you need to do something more complex than update fields with data, you can hook into this event, like so:

$('#my_autocomplete_field').bind('railsAutocomplete.select', function(event, data){
  /* Do something here */
  alert(data.item.id);
});

Formtastic

If you are using Formtastic, you automatically get the autocompleted_input helper on semantic_form_for:

semantic_form_for @product do |f|
  f.input :brand_name, :as => :autocomplete, :url => autocomplete_brand_name_products_path
end

The only difference with the original helper is that you must specify the autocomplete url using the :url option.

SimpleForm

If you want to use it with simple_form, all you have to do is use the :as option on the input and set the autocomplete path with the :url option.

simple_form_for @product do |form|
  form.input :name
  form.input :brand_name, :url => autocomplete_brand_name_products_path, :as => :autocomplete

Cucumber

I have created a step to test your autocomplete with Cucumber and Capybara, all you have to do is add the following lines to your env.rb file:

require 'cucumber/autocomplete'

Then you'll have access to the following step:

I choose "([^"]*)" in the autocomplete list

An example on how to use it:

@javascript
Scenario: Autocomplete
  Given the following brands exists:
    | name  |
    | Alpha |
    | Beta  |
    | Gamma |
  And I go to the home page
  And I fill in "Brand name" with "al"
  And I choose "Alpha" in the autocomplete list
  Then the "Brand name" field should contain "Alpha"

I have only tested this using Capybara, no idea if it works with something else, to see it in action, check the example app.

Steak

I have created a helper to test your autocomplete with Steak and Capybara, all you have to do is add the following lines to your acceptance_helper.rb file:

require 'steak/autocomplete'

Then you'll have access to the following helper:

choose_autocomplete_result

An example on how to use it:

scenario "Autocomplete" do
  lambda do
    Brand.create! [
      {:name => "Alpha"},
      {:name => "Beta"},
      {:name => "Gamma"}
    ]
  end.should change(Brand, :count).by(3)

  visit home_page
  fill_in "Brand name", :with => "al"
  choose_autocomplete_result "Alpha"
  find_field("Brand name").value.should include("Alpha")
end

I have only tested this using Capybara, no idea if it works with something else.

Development

If you want to make changes to the gem, first install bundler 1.0.0:

gem install bundler

And then, install all your dependencies:

bundle install

Running the test suite

You need to have an instance of MongoDB running on your computer or all the mongo tests will fail miserably.

To run all the tests once, simply use

rake test

while you're developing, it is recommended that you run

bundle exec guard

to have the relevant test run every time you save a file.

Integration tests

If you make changes or add features to the jQuery part, please make sure you write a cucumber test for it.

You can find an example Rails app on the integration folder.

You can run the integration tests with the cucumber command while on the integration folder:

cd integration
rake db:migrate
cucumber

Where to test what

If you're making or tweaking a plugin (such as the formtastic plugin or simple_form plugin), check out the simple_form_plugin_test for an example of how to test it as part of the main rake test run. Historically, plugins like these had been tested (shoddily) as part of the integration tests. Feel free to remove them from the integration suite and move them into the main suite. Your tests will run much faster, and there will be less likelihood of your feature breaking in the future. Thanks!

Thanks to

Everyone on this list

About the Author

Crowd Interactive is an American web design and development company that happens to work in Colima, Mexico. We specialize in building and growing online retail stores. We don’t work with everyone – just companies we believe in. Call us today to see if there’s a fit. Find more info here!

rails3-jquery-autocomplete's Issues

formtastic helper does not show value for EDIT

I found maybe same problem like Issue#8. Attribute value= is missing in Edit action:

just formtastic: OK
<%= semantic_form_for(@contact) do |f| %>
<%= f.input :company_name %>

with autocompleted_input: value attribute is missing
<%= f.autocompleted_input :company_name,
:url => autocomplete_company_name_contacts_path %>

After investigating formtastic helper autocompleted_input i found there is no need to have this helper. You can use :input_html key in formtastic.

This works:
<%= f.input :company_name,
:input_html => {:autocomplete => "/contacts/autocomplete_company_name" } %>

Nested models

Hi,

When I try to use autocomplete with nested models, this doesn't work :
Model Transport does not respond to geonames_country_country.

I have two models : People, and Transports. And a model GeonamesCountry in a plugin.
People has many Transports.

I have added this to controller Transports:
autocomplete :geonames_country, :country

Routes are :
resources :people do
resources :transports do
get :autocomplete_geonames_country_country, :on => :collection
end
end

So forms are like :
<%= form_for [@person, @transport] do |f| %>
<%= f.autocomplete_field :geonames_country_country, autocomplete_geonames_country_country_person_transports_path %>
<%= f.error_messages %>

<%= f.label :go_date %>

<%= f.date_select :go_date %>

[...]
<% end %>

Note that works without nested models.

How I can get this to work?

Thanks

feature: Load data from config yaml files

It would be really nice to be able to load the data from simple yaml files instead of having to always store and access the data from a full-fledged datastore. I will try to implement this functionality in my own fork.

Autocomplete Works With Create but Doesn't Work With Update

I have gotten autocomplete to work for the create action, however I can't seem to get it to work for the update action. This occurs despite the fact that I render the same form in the view for both actions.

Here is my route file:

resources :posts do
get :autocomplete_tag_name, :on => :collection
end
Here is what my controller looks like:

autocomplete :tag, :name, :full => true, :display_value => :display
def create
@post = current_user.posts.build(params[:post])
@post.tag_list = params[:post][:tag_list].gsub(/(\w)/, '')
if @post.save
redirect_to root_path, :flash => { :success => "Post successful!" }
else
@feed_items = []
render 'pages/home'
end
end

def update
@post = Post.find(params[:id])
@post.tag_list = params[:post][:tag_list].gsub(/(\w)/, '')
if @post.update_attributes(params[:post])
redirect_to @post, :flash => { :success => "Post updated." }
else
@title = "Edit Post"
render 'edit'
end
end
Here is the form rendered for both actions:

<%= form_for @post do |f| %>
<%= render 'shared/error_messages', :object => f.object %>

Title

<%= f.text_field :title, :class => "feed" %>

Further Description

<%= f.text_area :content %>

Input Tags (separate with comma)

<%= f.autocomplete_field :tag_list, autocomplete_tag_name_posts_path, :"data-delimiter" => ', ' %>

<%= f.submit "Submit" %>

<% end %> The html renders like this for Create:

And like this for update:

I am at a loss for what is going on here and why it would work with create and the update. My gut is that it has something to do the route. Is this right?

I want to do a custom display, but I want the field to be populated with the column field

Basically, I want the drop down to have the count for the item next to it. For that I am using these two methods:

def count
Tag.joins("JOIN taggings AS t ON t.tag_id = tags.id").where("t.tag_id = ?", self.id).count
end

def display
"#{self.name} (#{self.count})"
end

autocomplete :tag, :name, :full => true, :display_value => :display

However, while I want to show the count in the drop down menu, I only want the name of the tag to populate the field itself. I am novice and rails and jquery and unsure how to do this.

autocomplete html attribute

should probably be data-autocomplete - otherwise we're officially not support to start adding random attributes...

not working; conflicting documentation

This seems to document a new functionality for this plugin, while the detailed example documents the old way. Please make them work the same way; I'm a bit confused.

Also, it's not working! Whichever way I put it together (old way or new way, I get this error:

undefined method `downcase' for nil:NilClass

with no application trace, and a full trace showing the culprit as

rails3-jquery-autocomplete (0.3.4) lib/rails3-jquery-autocomplete.rb:35:in `autocomplete_person_name'

Can you tell if I'm doing something incorrectly? There are a lot of moving parts here. I'd be willing to help fix it, but I'm not quite sure what the problem is.

Thanks!

id_element is not updated on a selection change

I was using the id_element attribute, in order to update a hidden field with the id of the selected item from the autocomplete. Unfortunately, the id_element field was never updated. Looks like the selector for id_element in autocomplete-rails.js is missing the '#'.

Index ?

Thanks for the plugin... I was surprised that there was no mention of adding a DB Column Index on the field that the autocomplete is searching against. If you have 1000s of names that you are autocompleting against, w/o an index wouldn't the system die? thxs again

Support for formtastic

Hi!

Integration with formtastic would be a great addition. It would be possible to get it in a near release?

Thanks for your attention!

Add :class_name documentation to Readme

It took me a while to figure out that rails3-jquery-autocomplete supported namespaces via directly passing the class_name. Perhaps it would save someone else a lot of time to demonstrate an example case with namespaces in the readme itself:

If your model looks like Admin::User, then in the controller call autocomplete like so:
autocomplete :user, :name, :class_name => "admin/user"

Can we use a select and not text_area

Is there a way to select multiple items and have the form element as select and not text_area?

Field not updated with ID

Hello, you have a great gem and your example is very useful.
My autocomplete is working fine but I can't get it work with ID instead of name. I get Posicion(#120841716) expected, got String(#27769884), and if I look into parameters, its passing the name (nombre) instead of the ID...

Here is my code, hope you can help me..

vacantes_controller.rb (Already verified the id of the field)

autocomplete :posicion, :nombre, :full => :true, :id_element => '#vacante_posicion'

_form.html.erb

<%= f.label :posicion %>
<%= f.autocomplete_field :posicion, autocomplete_posicion_nombre_vacantes_path %>

# routes.rb

resources :vacantes do
get :autocomplete_posicion_nombre, :on => :collection
end

Limiting ajax calls

Seems like there should be some performance improvements in limiting the calls to find results when the last returned query is already less than ten and the user is only adding more characters to the input text.

Also when deleting from a string if it would remembers the search where the result was less than 10, it could also not call the db if the current text input contains that said string.

Additionally, is there a way to specify the number of results to be other than 10?

Thanks
Agustin

NotImplementedError for STI model

detection of ORM implementation does not work right for single table inheritance

# Returns a symbol representing what implementation should be used to query
# the database and raises *NotImplementedError* if ORM implementor can not be found
def get_implementation(object) 
  if object.superclass.to_s == 'ActiveRecord::Base'
    :activerecord
  elsif object.included_modules.collect(&:to_s).include?('Mongoid::Document')
    :mongoid
  else
    raise NotImplementedError
  end
end

Examples:
class Contact < ActiveRecord::Base; end
get_implementation return: :activerecord
class Company < Contact; end
get_implementation return: NotImplementedError

Case Insensitivity with PostgreSQL - ilike?

Hello, great gem. Problem is withPostgreSQL LIKE is not case insensative and needs to use iLIKE... is this possible via a setting?

Current value not showing in RESTful controller EDIT action.

I might be missing something simple, but I can't seem to determine the problem here:

The gem works great with the text fields I've assigned to it, however when I use my EDIT action in my restful controller, the field is not filled in with the current value of the field. In other words, it's not acting like a normal text_field. Any thoughts?

Note: I'm using a single form partial for my NEW and EDIT. I'm also using a virtual attribute getter and setter for this particular field. However, when I revert to a normal text_field helper, it works fine.

Thanks
Nick

scopes in Mongoid

Is there any reason why scopes is not enabled for mongoid?
the code is straightforward like active record I think.

Why is it not done for Mongoid?

search using autocomplete with multiple fields / data from another table

Hi,

1- I'd like to know if the gem authorize to autocomplete with multiple columns from the same model. I want to do so in order to have a search field where the user can type few letters and that will take a look in every columns of the model.

The documentation is detailed about to autocomplete a field which takes one column of the model. Is it possible to include few colums? If yes, maybe that could be interesting to add it in the documentation.

2- My model contains foreign keys, would it be possible to use the values of the data in the other tables?

I would like to keep it rails and not touch javascript. I saw this feature #15

Is it reliable? And would it match my requirements?

Thx

Rails 3.1 support

Any chance this will work with edge Rails anytime soon? I'm using rails-3.1.0.beta1, and I get the following:

Bundler could not find compatible versions for gem "rails":
  In Gemfile:
    rails3-jquery-autocomplete (~> 0.7.3) depends on
      rails (~> 3.0.0)

    rails (3.1.0.beta1)

Many thanks!
John

association

f.autocompleted_input :city_id, :url => autocomplete_city_name_places_path, :id_element => "#id_element_placeholder"

As in the request not to betray the name of the object and he vowed to assoсciation

jruby version: json_pure instead of yajl ?

Enjoyed testing this plugin.
Would love to use it, but have requirement to deploy on jruby.
Any chance you could remove dependency on yajl, perhaps json_pure?

Case Insensitive -> Removing the LOWER()

Is there any option to mark the autocomplete field as case insensitive?
As my column is case insensitive, this would greatly improve the performance by removing the LOWER() function from the sql.

Would it be possible, do add mongoid compatibility

Hi there,

I tried to implement your gem in combination with mongoid and failed. Would it be possible to add mongoid compatibility?

Best regards
sewid

:display_value ignored, field updates with id

First off, thank you for maintaining this gem, it's fantastic!

I am doing an autocomplete on a location. We have a Location model and a method within the Location model to return the city and state for the location to be displayed in the field. However, the field is updated with the id and not the value of the method described below. I am able to return data as I can see the type ahead suggestion appear below the field, as well as the JSON result in the Firefox Inspect Element 'Net/XHR' tab.

## Location model

def city_state
    "#{self.city.titleize}, #{self.state.upcase}" if self.city && self.state
  end

## Job Postings controller

autocomplete :location, :city, :display_value => :city_state, :extra_data => [:state, :latitude, :longitude]

# Search form partial
.
.
.
<%= autocomplete_field_tag :location, "#{ @geo.city_state if @geo }", location_autocomplete_path,
      :update_elements => { :id => "input#location" }, :placeholder => "City, State" %></li>
.
.
.

# Route

get "job_postings/autocomplete_location_city", :as => "location_autocomplete"

Select ORM manually

We use both Mongoid and ActiveRecord in our application and I want to use autocomplete on an ActiveRecord model. Unfortunately, the autocomplete plugin defaults to Mongoid if it is detected and there is no way to change this. Hence I get strange errors when making requests to the autocomplete action.

It would be great if there was an option to select the ORM in the model manually, like so:

autocomplete :tag, :name, :orm => :active_record

undefined method `key?' for "/messages/autocomplete_account_name":String

Why do I have this error?

undefined method `key?' for "/messages/autocomplete_account_name":String

I followed as far as I can tell the instructions and rake routes shows that I should have a route called autocomplete_account_name_messages, but it's using this odd "key?" method instead.

Autocomplete doesn't work with validate plugin

Hello,

I am using Jquery Validation plugin (http://bassistance.de/jquery-plugins/jquery-plugin-validation/).

On pages where this is used, the autocomplete does not work.

Below is the server request transcript:

Without validate plugin:
Started GET "/providers/autocomplete_provider_name?term=a"
Processing by ProvidersController#autocomplete_provider_name as JSON
Parameters: {"term"=>"a"}
Provider Load (0.2ms) SELECT id, name FROM providers WHERE (LOWER(name) LIKE '%a%') ORDER BY name ASC LIMIT 10
Completed 200 OK in 113ms (Views: 8.2ms | ActiveRecord: 0.2ms)

With validate plugin:
Started GET "/providers/autocomplete_provider_name?callback=jQuery15208518586533609778_1304578575617&term=a&=1304578579237"
Processing by ProvidersController#autocomplete_provider_name as JS
Parameters: {"callback"=>"jQuery15208518586533609778_1304578575617", "term"=>"a", ""=>"1304578579237"}
Provider Load (0.1ms) SELECT id, name FROM providers WHERE (LOWER(name) LIKE '%a%') ORDER BY name ASC LIMIT 10
Completed 200 OK in 59ms (Views: 10.3ms | ActiveRecord: 0.1ms)

Adding Counts Next to Autocomplete (Similar to SO)

I want to add the tag counts next the auto-completed term, similar to what is done on Stackoverflow. I am a complete novice when it comes to Jquery and a relative novice when it comes to Rails. I don't know where to being in order to add this functionality.

Any help in this area would be greatly appreciated! Thanks in advance :)

Allow usage of scope for autocomplete

I tried this afternoon to come to a solution to allow scoped queries for autocomplete. It is pretty easy to do, I just don't know how to create a patch for Git. So I will explain what to do:

1. Define a new key for the options (name :scope).
2. Add the 2 lines to the file helpers
   scope = options[:scope];
   model = model.send(scope) if scope

The meaning is, that if the option for :scope is defined, it will be used before the where-clause.

To use it then, you have to use the following:

1. Define in your model the scope:
   scope :valid, lambda { where('state_id in (?)', State.find(:all, :conditions => ["valid_in_work_item = ?", true]).collect{ | s | s.id}) }
2. Use that scope in the controller
   autocomplete :super_task, :title, :limit => 1000, :full => true, :scope => :valid, :class_name => Task

delay and minLength options don't seem to work

<%= autocomplete_field_tag :entity, "", "/cats/autocomplete", :delay => 10000 %>

I would expect my results to take a long time to come up but, it seems to be taking the default value for delay. Similarly, minLength doesn't seem to work. Am I just doing something wrong?

Changing the limit from 10 to something else

Is there an easy way to change the limit short of implementing get_autocomplete_items?

Customize autocomplete's query

I am trying to use this gem along with acts-as-taggable-on, and for the two to work properly I need to change the query from the standard find to something more like Question.tagged_with("%#{params[:term]}%", :any => true).

How can I do this?

Note: I tried going obtrusive to solve the problem by creating an action of my own with the above query entitled autocomplete_question_tags but I get an error because the server cannot find the necessary template.

Feat - select distinct

Well I wanted to fetch only distinct model object, comparates by only two attributes (while the table has 10+ attributes). I will share here my unobstrosive solution, without forking, if someone is interested.

It's pretty simple so I won't add anything. Here's the code :

yourmodel.rb :

#overrired of where for auto complete
def self.where(arg0)

    tabIds = []

    # traiter pour le autocomplete mais laisser la possibilité pour les autres
    case arg0
        when Array; tabInit = Place.find_by_sql("select * from Places where #{sanitize_sql_array(arg0)}")
        else tabInit = Place.find_by_sql("select * from Places where #{arg0}")
    end

    # enlever les doublons
    tabInit.each_with_index do |place, i|
        doublonFound = false
        tabInit.each_with_index do |place2, j|
            if j > i && !doublonFound
                doublonFound = place.eql?(place2)
            end 
        end
        if !doublonFound
            tabIds << place.id
        end
    end

    # retourner un truc que limit() ou autre fonction AR pourra traiter
    return super.where("id in (?)", tabIds)
end

def eql?(other)
    return self.name==other.name && self.where==other.where
end

New 3rd Param in json_for_autocomplete breaks old code

So in here

https://github.com/crowdint/rails3-jquery-autocomplete/blob/1067e4b3dc40952fbb46b70ec0497e5b55b3ce90/lib/rails3-jquery-autocomplete/helpers.rb

You've added a new 3rd param, extra_data

Can you please nil it out so it doesn't give a wrong arg count for old code, just extra_data = nil or something.

Thanks, great gem!

why getting undefined method?

I am getting the following error:

undefined method `account_name' for #Message:0xb5bddb88

I followed the README for my case and have the following:

  = f.autocompleted_input :account_name, :url => autocomplete_account_name_messages_path

And in the messages controller for which this form is using:

1 class MessagesController < ApplicationController
2 before_filter :authenticate_user!
3 autocomplete :account, :name, :full => true

Retrieving extra data for use in client-side javascript

I had an issue where I wanted my form to update an extra column about a user when the autocomplete field selected a specific user. In the current iteration, only id and the queried column are returned (or potentially the display_value method). I've forked this gem and added the functionality as well as an improvement and a fix. I haven't issued a pull request yet because a) I wanted to discuss them quickly here and make sure I've got the desired syntax and b) I haven't written/updated all of the tests yet because the current test suite is broken.

So, to return extra data to the client, I've added an option :extra_data to the controller's autocomplete method. It accepts an array of attributes and when the response is rendered, they are added into the response JSON. To use this on the client side, I've added an option :update_elements (similar to the current id_element) to the form_helpers. Instead of taking just a selector, this option takes a hash where the keys correspond to an object attribute and the value corresponds to a selector (e.g. for a user object, you could set :extra_data => [:email, :phone] and then use :update_elements => {:email => "#email_form_element", :phone => "#phone_form_element} to update two extra form fields). This can even replace :id_element, though I left it in to maintain backwards compatibility in this area. I can remove it if it is decided that's the best course of action.

I also mentioned submitting what I think is an improvement. Currently, this gem fetches entire objects from the database, even when returning very little information about the objects (only ID and the queried attribute). I've inserted a select clause that will select only the required columns based on the attributes requested. Currently, the id and the queried attribute are the default and anything specified in :extra_data gets added to the select statement. Since we want this function to be as fast as possible, it makes sense not to pull entire rows of data. I'm hoping the syntax for Mongoid is the same as ActiveRecord in terms of adding this select clause. I have no experience with it, but at the moment I just mirrored ActiveRecord's syntax for it.

Lastly, I mentioned what I thought was a bug. The way the form_helpers are written currently changes the behavior of the Rails form_helpers when I think that change is undesirable. text_field and text_field_tag are no longer able to specify the HTML attribute :autocomplete once this gem is installed as :autocomplete is re-written to be data-autocomplete. However, I think there could be instances when that might not be what is intended. Instead, only autocomplete_field and autocomplete_field_tag should be forced to use data-autocomplete as those are specific to this gem.

I'll look into writing tests in the not-to-distant future, but it would help if the current test suite wasn't broken. If you feel like checking out my changes, here they are: https://github.com/jakemack/rails3-jquery-autocomplete

Ambiguous column name when using scopes

When I try to use the autocomplete with a scope that joins in another table, I get an error when the column used in the Where condition is not unique between the two tables.

This seems to be because the Where condition generated does not prefix the requested column name with the table name.

Formtastic

Hello, not sure where tu put this, but here it goes. On the README, on the formtastic section it says that you should just do:

semantic_form_for @product do |f|
f.autocompleted_input :brand_name, :url => autocomplete_brand_name_path
end


However, there is a mistake, the url should look like this:

autocomplete_brand_name_products_path

:id_element attribute not working

Hi,

first of all thanks for the gem, it works like a charm, I just have one (hopefully minor) issue.

I have managed to succesfully integrate an autocomplete text field. It works so far and pulls the right data. I want to update a hidden field with the id it pulls from the database and that is exactly where the problem is:

In my form I have the following:

f.autocomplete_field :customer_name, autocomplete_customer_last_name_purchase_orders_path, :id_element => '#purchase_order_customer_id'

purchase_order_customer_id is a normal text field, which should, by my understanding, be updated with the id value of the option I selected in the autocomplete dropdown.

It renders as:
<input data-autocomplete="/purchase_orders/autocomplete_customer_last_name" id="purchase_order_customer_name" id_element="#purchase_order_customer_id" name="purchase_order[customer_name]" size="30" type="text" />
The :id_element attribute gets rendered as normal HTML attribute, therefore the update does not work.

Shouldn't it be rendered as something like data-id-element ="#purchase_order_customer_id' in order to work?

Or am I missing something here? I tried to follow the readme as closely as possible, please bear with me If I'm asking stupid questions, this is my first rails project…

Thanks in Advance

Leo

rails3-jquery-autocomplete disables logging on Heroku

When using rails3-jquery-autocomplete in a Rails 3 application deployed to Heroku, the application logs no more show up in the logs displayed by the command "heroku logs".

I could not find the cause of the issue. I've setup a application example here: git://github.com/Florent2/test-logs-heroku.git

Here is how to reproduce the bug:

$ git clone git://github.com/Florent2/test-logs-heroku.git
$ cd test-logs-heroku
$ heroku create
$ git push heroku master
$ heroku open
$ heroku logs --source app

When reaching the homepage, the log message "*** SEE ME ***" should appear in the result of the heroku logs command. But it does not appear.

If one follows the following steps to remove the gem rails3-jquery-autocomplete the logs work again on Heroku:

• edit Gemfile to comment the "gem "rails3-jquery-autocomplete" line

$ EDIT: bundle
$ git ci -am "Remove the rails3-jquery-autocomplete gem"
$ git push heroku master
$ heroku open
$ heroku logs --source app

This time the log message "*** SEE ME ***" appears.

Cannot understand the example given in the ReadMe

This form builder example from the Read Me is confusing to me:

 form_for @product do |f|
    f.autocomplete_field :brand_name, autocomplete_brand_name_products_path
 end

When I try to recreate the example, I get undefined method `brand_name'.

The Read Me doesn't show what the product model's associations look like. I would assume that product belongs_to :brand. If that's the case, I still don't see where the :brand_name method is defined for product.

Does not work with elements created post-document.ready

Since autocomplete-rails.js is entirely wrapped in $(document).ready(...) it will only work with elements that are on the page when the document is initially rendered. This causes forms that are rendered via ajax to not work with autocompletion.

:submit_on_select option not working

It appears the default behavior is to auto submit on selection by clicking. Interestingly, this doesn't happen when using the Return key to select. I've tried using :submit_on_select => false, and it has no effect, still autosubmits on mouse selection. Is this correct, expected behavior?

data-id-element does not update element

Hi,
I have 2 model Company and City with this association:
class Company < ActiveRecord::Base
belongs_to :city
end

class City < ActiveRecord::Base
has_many :companies
end

I'd like to get the id of the selected city into comany form, I tried in this way:

= f.autocomplete_field :city, autocomplete_city_name_companies_path, "data-id-element" => "#city_id"
#city_id

so I have the div with id="city_id", should not be updated with selected city id?

Wrong autcomplete method

Having an Order which belongs_to client, in the Order view I want to auto-complete the Client name (Client.name), so the generated route method is autocomplete_client_name_orders_path instead of autocomplete_client_name_path like the documentation suggests.

Thanks for your attention!

Problem with difference in relation name and class name

I would like to use autocomplete as shown in the example, but my model makes me problems. Here it is:

class Task < ActiveRecord::Base
has_many :sub_tasks, :class_name => "Task", :foreign_key => "super_task_id"
belongs_to :super_task, :class_name => "Task", :foreign_key => "super_task_id"

class TasksController < ApplicationController
autocomplete :super_task, :title, :full => true, :display_value => :super_task_title

When I use that definition, I get an error that the type SuperTask is now known (NameError (uninitialized constant SuperTask))

When I use instead

autocomplete :task, :title, :full => true, :display_value => :super_task_title

I get the error undefined method `task_title' for #Task:0x26a2c10

So how could I use autocomplete with an object where the relation is named different to the object class name?

---

Here a short answer (after reading the code):

autocomplete :super_task, :title, :full => true, :class_name => Task

did what I wanted to do. It displays all the tasks as a drop down list when using the form:

autocomplete_field :task, :super_task, autocomplete_super_task_title_tasks_path

Perhaps the answer helps someone.

allow autocomplete options in the UI

The current situation is that you have to declare how autocomplete is used in the controller. I would like to have a way to express that the same model in the same controller may have different autocomplete_fields which behave differently. Just an example to show how that could be useful:

There could be 2 UIs to conntect to tasks in the same Controller, one that allows to choose freely from all available, the other to scope the selection by some additional where-clause.

At the moment, the definition of the clause is done in the controller in the declaration like
autocomplete :task, :title, :limit => 1000, :full => true

I would like to use these options in the UI as well, so I could overwrite the default options defined here. So one UI could look like:

<%= f.autocomplete_field :task, autocomplete_task_title_work_items_path, :id_element => "#task_id" %>

The other would look like:

  <%= f.autocomplete_field :task, autocomplete_task_title_work_items_path, :id_element => "#task_id", :full => false, :scope => :valid %>

I don't see a way to reach that currently without modifying the implementation deeply. Perhaps someone else has an idea how to do it with modest changes.

Superclass mismatch for class SemanticFormBuilder

Formtastic 2.0 has deprecated Formtastic::SemanticFormBuilder in favor of Formtastic::FormBuilder. So if you are using Formtastic 2.0 you need to change the line

class Formtastic::SemanticFormBuilder < ActionView::Helpers::FormBuilder
to
class Formtastic::FormBuilder < ActionView::Helpers::FormBuilder

from rails3-jquery-autocomplete.rb file

Missing step from documentation

Hi!

Having an Order which belongs_to client, in the Order view I want to auto-complete the Client name (Client.name).
When I try to use this plugin like the documentation says, I've got the following error:
"Model Order does not respond to client_name"

and the only way to get ride of this error is to create the method client_name in the Order model.

Thanks for your attention!