#258 Token Fields (revised)

Hey, you are missing when user did not select any item on the list, episode-258 / revised / bookstore-chosen-after.

Great episode Ryan, but i think is better to use:

ilike

instead of using:

like

To avoid problems with case sensitive strings.

And another tip for using TokenInput is to set the option of:

preventDuplicates: true

TokenInput seems great. It strikes me as a great solution for tags. Any comments on this?

Great episode, but shouldn't the token source be based on a path or url function like this?

$("#article_co_author_tokens").tokenInput $("#article_co_author_tokens").data("token-source")
  prePopulate: $("#article_co_author_tokens").data("pre")

f.input :co_author_tokens, label: false, input_html: {data: {token_source: search_usernames_path, pre: @article.co_authors.only(:id,:username).map(&:attributes).to_json}}

Please note this is from a project that uses Mongoid and SimpleForm.

Another excellent and very useful episode. Folks, there is a pattern here. When Ryan says, "Hold on to your seats." He is not kidding. That is when he is at his best :) Hey Ryan, please make a point of saying that every week in either the "Pro" or the "Revised" episodes :)
Best regards,
Bharat

I've a little question about Ruby: at 5:46, when Bates wrote attr_accessible :author_tokens, attr_reader :author_tokens will be optional, right?

Awesome episode. Thanks Ryan.

Is there a way to configure Chosen to support the inline create option?

Ryan - Thanks for another great episode.

Anyone using Chosen with Twitter Bootstrap? Any issues?

A friend of mine has put together a select2-rails gem if anyone is interested.

Hello, I get this error when trying to create the author_token field using simple_form:

wrong number of arguments (0 for 1)

The funny thing is I get that error even if I do this:

= f.input :author_tokens, :data => '1,2'

Seems that no matter what I put into :data => I keep getting this error. I even get it if I don't use simple_form but the regular form_for tag. I should mention that I'm using Ruby 1.8.7 if that makes any difference.

Help please.

Does anyone know how to make Chosen behave with existing styles? It works in my simple_form based forms but it is completely out of whack with the styling of other elements? My form elements have the labels at the top with the input boxes/dropdowns in the bottom. Chosen forces the labels to be on left hand side. Also it is misaligned.

Any pointers on how to make it blend with the rest of the form?

Thanks.

Bharat

Does anyone know how to add the new
to the results when token input can find something? I tried just doing

authors << [{id: "<<<#{query}>>>", name: "New: \"#{query}\""}]

but for some reason that throws out an error. Firebug tells me the error is 'value undefined' and the token input drop down list disappears. I just don't get it. If the authors is empty it will return the new field just fine but if it finds any results it does not like the new added in.

I was able to create the relationship with a many to many, but with a many to one (where the book table has a corresponding ID for the format table for example) it doesn't work.

I can search but it will not save the values, nor will it prepolue the existing ones.

I'm sure I'm doing something wrong, but I pretty much copy/pasted the one for authors. Is there anything else that needs to change for this to work?

I don't get any javascript errors or warnings whatsoever.

Thanks.

I'm using form_tag not form_for. I got the autocomplete working but when I submit the form, no parameters are passed. If I remove the javascript and submit the form, my inputs are passed as expected. Any ideas?

hello, i was wondering if it was possible to have the drop down display something different from what the user selects? ie in stack overflow, if you type in java, it might display something like 'java x 34' because its count is 34. but when you select it, it just becomes 'java'. is it possible to do it with the jquery token input? ive been reading the documentation and it seems like it only has the :id and :name attribute. i tried doing something like...

tags.map{ |tag| { id: "#{tag.id}", name: "#{tag.name} x #{tag.count}", value: "#{tag.name}" } }

but no success. any ideas?
thanks = )

hello I am trying to save to the field society_id which takes the data from User table (current_user.society_id). I am using Devise.

def self.ids_from_tokens(tokens)
tokens.gsub!(/<<<(.+?)>>>/) { create!(name: $1, society_id: current_user.society_id).id}
tokens.split(',')
end

It gives an error undefined variable current_user.

Current_user is defined by Devise for controller and view but it doesn't work with model i guess.

can someone help me how to make it work

I'm having problems with chosen.

jQuery ->
$('#resource_tag_ids').chosen()

is returning

Uncaught TypeError: Object [object Object] has no method 'chosen' in Chrome.

(Putting tags on a resource instead of authors on a book, but that shouldn't matter)

I can see that for some reason the chosen javascript file is being included twice, one with code, and the other is a blank 4 lines... which is really odd.

I'm getting the same error as David Fisher no matter what browser I use. I'm using rails 3.2.5. I've tried both the 'chosen-rails' gem and installing the files by hand.

Object # has no method 'chosen'

Great episode as always. One small question thought: What's the best way to handle validation? (Especially if you create multiple new records using jquery tokeninput)

Has anyone gotten the TokenInput to work with Nested Forms from his revised #196 episode? (http://railscasts.com/episodes/196-nested-model-form-revised)

There is some magic in the tokenInput code i don't understand. It's closely related to one of the problems I'm having at the moment.

def author_tokens=(tokens)
    self.author_ids = Author.ids_from_tokens(tokens)
end

seems to create the association between book and authors.

Now the problem. What if I have more attributes on the book_author join table I wish to set before saving the association?
How can I go about this, I'm pretty lost at the moment as I've tried several ways but none works nicely and looks like the Rails way to do it.

PLEASE HELP - any hint would be greately appreciated!

I have used this with my meal planner app. I have it working but wonder, as above user. Can you add additional data? Example

I have it working to add ingredients to a meal. How could I specify the quantity of each ingredient? I am experimenting with the onAdd method, any help would be appreciated.

For my app, my models are Feature instead of Book, Tag instead of Author and Tagging instead of Authorship.

I must have made a mistake:

I'm getting an error NameError in FeaturesController#create of uninitialized constant Feature::Tagging

and under the trace:
app/models/feature.rb:33:intag_tokens='`
app/controllers/features_controller.rb:66:increate'`

Has anyone else made this mistake?

Thank you,
Doug

A little sad that after so long, jQuery-tokeninput still doesn't support adding new tags.

I needed a simple solution for tagging. The usual Tag => HABTM <= User stuff.

I tried a different solution, using Drew Wilson's Autosuggest and ActsAsTaggableOn. Save the tag tokens as textfields and insert those those as tags.

    def tag_tokens=(tags)
      # Tag tokens is a method for the JS script to pass in a comma delimited string of tag names
      if tags.present?
        self.tag_list = [] # For removing tags to work. So tags are re-assigned everytime
        self.tag_list << tags.split(",").reject{|t|t.empty?}
      end
    end

Because ActsAsTaggableOn has those stuff like removing entries without associations etc, so that's all I did.

I am having trouble getting the javascript to load properly

Uncaught TypeError: Object [object Object] has no method 'tokenInput'

any suggestions on what I'm missing and yes it is loaded in the list of scripts

If you're using acts-as-taggable-on and you're getting 'Validation failed: Context can't be blank', the following should work:

def tag_tokens=(ids)
  self.tag_list = Tag.where(:id => ids).map(&:name)
end

Is there any idea not to select the name that is already choosen in token input? for example In first i select mango when i search for m. Next time again when i search for m Mango should not be displayed as mango is already choosen. Is there any idea?

I've spent hours trying to get Chosen to work and have posted question on Stackoverflow with no luck--including necessary lines in application.js, application.css, and adding the appropriate coffeescript. I'm using Bootstrap and think that may be getting in the way. Are there any css directories I should be clearing out? Thanks!

Hi there, anybody know how I can implement this to self referential model. I am creating a record and on a form view also creating any associations needed if exists. if it doesn't exist, I should be able to add new one like in this railscast. this is where I got stuck. can anybody please help. Thanks!

i need to set the border-color dynamically????

Hi Ryan, great episode.. thank you.

anyone know what formtastic needs in the form to replace the collection_select for the first example (using Chosen). I have this:

f.input :change_set_revisions, :as => :select, :collection => ChangeSetRevision.all.sort_by(&:name).reverse

but it sticks with the normal multiple-select drop-down box. I do not get the javascript decoration.

@chewmanfoo, I'm not sure but I'm guessing you're missing the css style and instantiating the behavior:

f.input :change_set_revisions, :as => :select, :collection => ChangeSetRevision.all.sort_by(&:name).reverse, :input_html => { :class => "chzn-select" }

And then instantiate add the behavior to elements with the .chzn-select css class:

$(".chzn-select").chosen();

Hi I have a problem, only the first row of my table is the right chosen dropdown and the next rows are not.

<table>
     <thead>
         <th>Item Name</th>
     </thead>

      <tbody>
         <% @purchases.each do |p| %>
           <tr>
               <td>
                    <select title="Choose an Item..." id='form_field' style="width:350px;">
                     <% @items.each do |i|%>
                        <option value = "<%= i.id%>"><%= i.name%></option>
                    <%end%>
                    </select>
              </td>
          </tr>
         <%end%>
<table>

<script>$("#form_field").chosen()</script>

I have an issue where the form is sending nil when it has found a match for the query.

anyone know what up wit dat?

My needs are a little different than the video. I want a field where I can put in the name of a book. It does the index jason search and has a tokenLimit of 1. If the book is not found - it makes a new book. If the book is found I want the controller to direct me to the book that already exists show page. For some reason right now if the book is found it sends an empty name parameter to the controller and I cant figure out why.

got it - had to set the tokenValue

Has anybody got the tokeninput example working with Postgres? I've tried substituting the like for ilike and ILIKE but it doesn't seem to work, in the console the q is registering but the query itself remains blank, %%. Any help would be appreciated.

Anyone realize that tokeninput doesn't work on IE9? Seems like a pretty obvious no-go considering 17% of the internet still uses IE.

Does someone know how to implement the same function of this railscast instead of jQuery tokeninput with select2?

after upgrading from rails 3.2 to 3.2.13 tokeninput doesn't get the results anymore. Something doesn't work. The only clue I have are these 2 parameters that weren't sent in 3.2: /tags.json?callback=jQuery191040979262322760657_1364525075625&q=books&_=1364525075627

All the logic in controller and model works fine. The request goes through, but then the results aren't submitted back to tokeninput. Does anybody experience similar things in 3.2.13??

Missing this!

def self.ids_from_tokens(tokens)
    tokens.gsub!(/<<<(.+?)>>>/) { create!(name: $1).id }
    tokens.split(',')
  end

Got this from the source.

Can someone please help me - very desperate, will pay!
My very simple Rails App has a Model with two methods:

:From :To

I use the awesome (Google Maps API) powered address-rails-picker app for the :to and :from in the form to automplete any location the user types in.

I do however have trouble in writing a validation that forces the user to choose an autocomplete location instead of writing any gibberish the user wants.

Would the Token Input help here by limiting it to one? I don't wan the Facebook look though with the X etc.

Thank you, Ryan.
I got a syntax error with tokenInput and Rails 3.2.13, but fortunately fixed it by myself.
I guess that the new version of CoffeeScript compiler in Rails caused it.

What I got was

SyntaxError: unexpected INDENT

The solution is simple.
Just add "," after '/tags.json' in books.js.coffee.

$ -> 
  $('#book_author_tokens').tokenInput('/tags.json',
    theme: 'facebook'
    prePopulate: $('#book_author_tokens').data('load')
  )

How do you use this plugin with SimpleForm?

I have issue integrating tokeninput facebook them with bootstrap modal. I googled the issue and it looks like a z-index problem. But I cannot get it working after trying every solutions. I would really appreciate if there could be a tutorial on tokeninput with bootstrap (maybe with modal)

If I want to create a Book manually, how do I pass the Authors manually? An array doesn't seem to work. I'd basically like to do something like:

Book.create!(title: '10 yards to the Shitter', author_tokens: ['Will E Makit', 'Betty Wont'])

I need to call the create action from another model... and I can't seem to pass the author_tokens properly.

I have an issue with several has many throughs connecting the same models. As an example Book and Person connected through Reader and Writer. How does my equivalent of "author_tokens" setter method distinguish which one to save?
I have made reader_tokens and writer_tokens methods, but when they do
self.person_ids = Person.ids_from_token(tokens) I can't name the relationship (reader or writer). Should I move my method to the relationship models, or how can I modify them, so they work?

Hi,

How can I implement tokeninput in Rails 4 ?

With the strong parameters I can't use attr_accessor so it doesn't work.

Any idea ?

Since rails 4.0.1 it is not working anymore. Cause activerecord is doing a check which results in the following error: "ActiveRecord::RecordNotFound (Couldn't find all Tasks with IDs (2, 3, 1) (found 0 results, but was looking for 3)):"

I did opened a issue a github for it: https://github.com/rails/rails/issues/14272

http://stackoverflow.com/questions/23212898/tokeninput-not-load-the-existing-data-unless-reloading-page

I followed the railscast tutorial , but I found I can not load the "saved tokens".

I think the problem is that when click 'edit' link (created by scaffold),

it didn't trigger the preload function, how do you fix the problems in Rails 4

View page

  .form-inputs
    = f.input :name
    = f.input :content
    = f.text_field :user_tokens, data: {load: @article.users}

My coffeescript

$(document).ready -> 
  $('#article_user_tokens').tokenInput '/users.json',
    theme: 'facebook',
    prePopulate: $('#article_user_tokens').data('load')

Require the css and js file

 *= require token-input-facebook
 //= require jquery.tokeninput

Thank you so much, I've been looking for doing this with has_many :through for so long. I'm trying to work this with autocomplete as well. It's surprising how so few results there are for "has many through autocomplete" in a search.

How would you implement chosen or select2 if your has_many through join table is not using the default id as a primary key? Is the syntax author_ids something rails handles automagically in the standard join table?

Did anyone get the saving to work? My search works fine but I can't insert anything to my join table. Sample please!

Testing with capybara/cucumber? check my gist https://gist.github.com/victorhazbun87/46d86d9de77540bbbceb

Any solution on prepopulating the authors data in edit page. It's not working for me. I am using rails 4.2.8 version.

_form.html.erb

<%= f.label :author_tokens, "Authors" %>
<%= f.text_field :author_tokens, data: { load: "@book.authors" } %>

books.coffee
jQuery ->
$('#book_author_tokens').tokenInput '/authors.json'
theme: 'facebook'
prePopulate: $('#book_author_tokens').data('load')