3

Im trying to use the jquery tokeninput found here: http://loopj.com/jquery-tokeninput/ Following the guide from railcasts: http://railscasts.com/episodes/258-token-fields

By default, it required a 'name' column on the table/json..

Any way to customize to change it to something else (in my case, 'account_number')?

(in the reailcast, he says if you dont have a 'name' column, youll require extra customization)

Jonah Katz
  • 5,230
  • 16
  • 67
  • 90

2 Answers2

6

The magical lines are 

<%= f.text_field :author_tokens, "data-pre" => @book.authors.map(&:attributes).to_json %>

and 

format.json { render :json => @authors.map(&:attributes) }

These lines convert the data read from table into the json which jquery-tokeninput can understand. It passes on all the data from the model into, jquery-tokeninput, but it is not necessary. Tokeninput, only needs two fields,

  1. id -> for each selected token, this is posted along with form
  2. name -> used as label of the token

If you don't want to have a name field in your model, and want to use account_number as the label, you can do it like following:

<%= f.text_field :author_tokens, "data-pre" => @book.authors.collect {|author| {:id => author.id, :name => author.account_number } } %>

and

format.json { render :json => @authors.collect {|author| {:id => author.id, :name => author.account_number } }

Basically, change the json passed to tokeninput. Pass accoun_number as name.

Update:

Change this line to something which better suits you:

@authors = Author.where("name like ?", "%#{params[:q]}%")

One suggestion may be:

@authors = Author.where("name like ?", "#{params[:q]}%")

Remove the first %, but really depends on your data type and all.

rubish
  • 10,887
  • 3
  • 43
  • 57
  • Got it!!! You are the best!! I was on the verge of giving up before you came along. – Jonah Katz Jul 25 '11 at 17:32
  • Glad to help :). Didn't knew there was a railscast on the topic, until recently I saw some questions on SO about it. – rubish Jul 25 '11 at 17:41
  • 1
    Sorry to ask a follow up question after saying everything was good but just encountered a small error.. When i go to an author (my case pi_name), the prefill fills with about 20 "undefined"'s.. Here my code: `<%= f.text_field :account_number_tokens, "data-pre" => @pi_name.account_numbers.collect {|account_number| {:id => account_number.id, :name => account_number.accoun t_number }} %>` – Jonah Katz Jul 25 '11 at 17:41
  • there is an hanging space, I can see in `account_number.accoun t_number`, might be just a typo. Don't forget the `to_json` after collect. – rubish Jul 25 '11 at 17:43
  • 3
    Two thins to make sure, first, there is a field `account_number` in model `account_number`, second, add `to_json` at end of collect. – rubish Jul 25 '11 at 17:48
  • to_json did it! All my problems are solved, things are working beautifully . Great help! – Jonah Katz Jul 25 '11 at 18:09
2

Just add the "propertyToSearch" options :

$(function() {
  $("#user_tokens").tokenInput("/users.json", {
    crossDomain: false,
    propertyToSearch: "account_number",
    theme: "facebook",
  });
});
Chadi
  • 97
  • 6