Questions tagged [jquery-tokeninput]

Tokeninput is a jQuery plugin which allows your users to select multiple items from a predefined list, using autocompletion as they type to find each item. You may have seen a similar type of text entry when filling in the recipients field sending messages on facebook.

Overview

Tokeninput is a jQuery plugin which allows your users to select multiple items from a predefined list, using autocompletion as they type to find each item. You may have seen a similar type of text entry when filling in the recipients field sending messages on facebook or entering email-ids in Gmail compose pop-up window.

Features

  • Intuitive UI for selecting multiple items from a large list
  • Easy to skin/style purely in css, no images required
  • Supports any backend which can generate JSON, including PHP, Rails, Django, ASP.net
  • Smooth animations when results load
  • Select, delete and navigate items using the mouse or keyboard
  • Client-side result caching to reduce server load
  • Crossdomain support via JSONP
  • Callbacks when items are added or removed from the list
  • Preprocess results from the server with the onResult callback
  • Programmatically add, remove, clear and get tokens
  • Customize the output format of the results and tokens

Screenshots

enter image description here

enter image description here

More at: http://loopj.com/jquery-tokeninput/

279 questions
3
votes
1 answer

Using jquery tokeninput and acts_as_taggable_on

I've implemented the framework outlined in this post: How to use jquery-Tokeninput and Acts-as-taggable-on with some difficulty. This is working insofar as prepopulating with the appropriate theme and ajax search, but when I enter a new tag, it is…
panzhuli
  • 2,890
  • 6
  • 33
  • 46
3
votes
2 answers

How do I display a dropdown list 'above' the input element

I am using jQuery Tokeninput plugin to display an autocomplete list of musical artist names, delivered via jsonp. This all works fine, however I need to have the input in a fixed footer on the page meaning that of course, the dropdown list itself…
gordyr
  • 6,078
  • 14
  • 65
  • 123
3
votes
2 answers

Using jquery TokenInput without default 'name'

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…
Jonah Katz
  • 5,230
  • 16
  • 67
  • 90
3
votes
1 answer

How to get added token id, name list from the jquery-tokeninput plugin via Javascript?

How can I get the id, name value pairs of the tokens (entered by a user) via Javascript from the jquery-tokeninput plugin found here? https://github.com/loopj/jquery-tokeninput Is it just me or isnt it surprising that this plugin has a lot of…
Harindaka
  • 4,658
  • 8
  • 43
  • 62
3
votes
2 answers

jquery TokenInput library - how to reset to initial state

I am using jQuery TokenInput from http://loopj.com/jquery-tokeninput/. I have a senior that user can add only one token so I use tokenLimit: 1, But when user select the token the another li is added automatically and the element width is increase…
Jigarb1992
  • 828
  • 2
  • 18
  • 41
3
votes
1 answer

How do I a use Javascript or ajax to inject or add a the value of an input field in a textfield in real time?

I have a text_field of id #image_tag_list_tokens and the textfield appears as follows in the image form: = f.text_area :tag_list_tokens, label: "Tags (optional) ->", data: {load: @image_tags }, label: "Tags" I have an input field and a button as…
codigomonstruo
  • 1,081
  • 1
  • 11
  • 45
3
votes
2 answers

jquery: prepopulating autocomplete fields

I'm using the tokenizing autocomplete plugin for jquery ( http://loopj.com/2009/04/25/jquery-plugin-tokenizing-autocomplete-text-entry ). I mostly use Ruby, and I'm really unfamiliar with javascript, though. My basic setup looks like this, and works…
3
votes
1 answer

jQuery TokenInput with Meteor

How can I include jQuery TokenInput with the Meteor framework? I couldn't find a smart package so now I am wondering how I can do it without needing a smart package. For example how to include the jquery.tokeninput.js? As for coming up with a script…
user1952811
  • 2,398
  • 6
  • 29
  • 49
3
votes
1 answer

javascript not executed unless reloading page using turbolinks and rails 4

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 …
newBike
  • 14,385
  • 29
  • 109
  • 192
3
votes
2 answers

Token Input only works once i refresh the page

So when i first go to a page where i use TokenInput, the tokeninput never hits my input form. Only after i refresh the page it works. Why is this and how can i make it work when i initially go the page? When i first go to my page. Look at players…
Pierre
  • 1,114
  • 2
  • 10
  • 24
3
votes
4 answers

How to order results by closest match to query?

I have a field where I'm using Jquery TokenInput to autocomplete a Product. To find the products I'm doing: def token @products = Product.order(:name) respond_to do |format| format.html format.json { render json:…
3
votes
3 answers

Prepopulate jquery token input textbox

on the page load i have a token input ie, $('.txtWard').tokenInput(ward, { theme: 'facebook', allowCustomEntry: true, …
user2119324
  • 587
  • 8
  • 24
3
votes
0 answers

Jquery-tokeninput not working properly on mobile

We used jquery-tokeninput to let users search for their linkedin and facebook friends and select. We are facing number of problems An orange box highlights the text box when the user starts typing in the box. But this orange box does not fully…
user2012953
3
votes
6 answers

jquery tokenInput how to change the ajax call url to script dynamically

I'm using this powerful and beautiful plugin http://loopj.com/jquery-tokeninput/, but I encountered a problem. Is there a way to dynamically change or alter the URL of the ajax call in my tokenInput. So for…
PinoyStackOverflower
  • 5,214
  • 18
  • 63
  • 126
3
votes
2 answers

Jquery Token Input not populating values from database, in ASP.NET MVC 3

I am new to jQuery Token Input and am learning through this tutorial. What I want to do ? I want to show values from database as the user types in the value into the textbox using jQuery Token input. What have I tried so far ? So far, this is what…
Yasser Shaikh
  • 46,934
  • 46
  • 204
  • 281
1
2
3
18 19