0

I created a form where user can create a profile and select keyword from an autocomplete token field using jquery tokenInput. the problem is as soon as I call .tokenInput() on the textfield, the text in it is not sent when the form is submitted. I'm using mongodb. here is my profile class:

class Profile
  include Mongoid::Document
  include Mongoid::Timestamps


  field :status, type: String
  field :displayname, type: String
  field :city, type: String
  field :country, type: String
  field "_id", type: String, default: ->{ displayname.to_s.parameterize}

  attr_accessible :user_tags, :displayname, :city, :country, :tagg_tokens

  attr_reader :tagg_tokens

  belongs_to :user

end

my coffeescript file:

$("#profile_tagg_tokens").tokenInput '/taggs.json' theme: 'facebook'

my form: 

=f.text_field :tagg_tokens

anybody else had this issue before? thx for your help

user1445685
  • 793
  • 1
  • 11
  • 25
  • take a look at the source of this demo page http://loopj.com/jquery-tokeninput/demo.html#pre-populated – jvnill Feb 18 '13 at 12:49
  • 1
    thx for your reply but it doesn't really help me – user1445685 Feb 18 '13 at 13:02
  • you said that you already have text on the text field which means that you're looking at prepopulating the text field with tokens which is what i just linked to. – jvnill Feb 18 '13 at 13:04
  • 1
    no sorry. what I wanted to say is when I fill the form, including the tokenInput, the all the content of the form is sent when it is submitted except the tokens for which I get an empty string – user1445685 Feb 18 '13 at 13:11

1 Answers1

0

the tokens just generate a simple html by default so no part of the token is sent with the form. I suggest you look at using one of the callbacks to add a hidden input

onAdd: function (item) { $('form').append('<input type="hidden" value=' + item.id + '>' }

I havent tested that one but you should get the idea. You can also use another option called tokenFormatter (also not tested)

tokenFormatter: function(item){ return '<li><p>' + item.propertyToSearch + '</p><input type="hidden" value=' + item.id + '></li>' }
jvnill
  • 29,479
  • 4
  • 83
  • 86
  • 1
    I managed to make it work but had to write too much code for my taste. there might be some way to let the plugin handle the process on its own. If not I'll try to find another plugin – user1445685 Feb 18 '13 at 15:44