Allow custom entry and avoid parallel ajax calls #291

wants to merge 19 commits into

For Tom's Guide and Tom's Hardware specific behaviour, we added a new option that allows custom entries that are not in suggested list.

By default this option is set to false.

When allowCustomEntry setting is true:
- type comma allows to add a token that isn't suggested in token list
- and when no token is selected, type enter or tab adds current token

By the way, in order to improve performances and avoid waiting for ajax calls timeout when webservice is too slow, we abort previous running search before launching new one.

Init example

$('#inputTokenId').tokenInput('/my/url/', {'allowCustomEntry' : true});

Demo (on tag input)


I pulled this into my fork


this is exactly what I was looking for


Thanks for this.

I pulled this into my fork and made a small fix to prevent empty tokens from being created.


Pulled in my fork too.


This is great, however when you press comma it will add ONE, and only one new entry that doesn't exist in list. Is there something I'm missing? not doing right?, as it seems to work on your website OK- On that page you can add as many tags as you want that are new.

9mm commented Jun 1, 2012

@earnshaw the same thing happened to me. try this:


@ecefx - you are an absolute legend! Thank you very much for letting me know about that. Made my day!


This is sweet! Thanks so much!


This is absolutely epic and thanks a bunch for adding it. However, it should probably be modified to ignore empty strings. Right now in the demo if you type space + comma or space + enter it will result an an empty token being added to the list.

lgiraudel and others added some commits Oct 17, 2012

In my code, I have used tokenInput for 4 consecutive text boxes. I have used the token-input.js in

I wish to add a new token when the custom text is pasted using (ctr+v) or by mouse right click and paste. I have added the following code:

$(".container").live("paste", ".token-input-input-token input", function(){
setTimeout(function () {
if ( $('.token-input-input-token input').val() != '') {
newToken = {'id':$('.token-input-input-token input').val(),'name':$('.token-input-input-token input').val()};
return false;

return false;

}, 100);

The code is working fine for the first text box while for other 3 text boxes new token is not created on paste event.

Could you help me to fix the issue?

@ace-n ace-n referenced this pull request in acm-uiuc/liquid Sep 21, 2013

Quote DB-Problems submitting quote #154


will it be great if it works with prevent duplicate with case sensitive or insensitive


Edit: Fixed on this commit: emir/jquery-tokeninput@ae178c4

when I use like below, I got "undefined", do you have any ideas?

$(".skills").tokenInput("/api/v1/skills/find", {
        propertyToSearch: "title",
        theme: "facebook",
        allowCustomEntry : true,
        highlightDuplicates : false,


emir and others added some commits Jul 22, 2014
@emir emir fixed hardcoded object on addCurrentTokenInputValue function then add…
…ed propertyToSearch on it
@lgiraudel lgiraudel Merge pull request #3 from emir/master
fixed hardcoded object on addCurrentTokenInputValue function then added ...
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment