Take the 2-minute tour ×

I am wondering whether it's possible to add new values on the fly to a chosen.js multiselect (similar to how tagging works).

I've seen in another SO post a user saying this is possible. He links to an example and a fork on github, but I've had some difficulties implementing those.

The source code is written in CoffeeScript. I've tried compiling it (using an online compiler) to regular JavaScript, copy pasted the code into a blank test project but I got errors. After that, I've loaded The AbstractChosen and SelectParser as well (compiled them to js) and didn't get errors, but the 'add items on the fly' functionality is not there (although i initialized the chosen described in the aforementioned link).

Has anybody worked with this fork? If yes, could you please share your experiences with it?

share|improve this question
add comment

2 Answers

up vote 1 down vote accepted

The problem you have is because you haven't follow the steps in the documentation:

If you download the source, install the correct packages and run the build commands you end with a chosen.jquery.js, chosen.proto.js and chosen.css.

So the following steps should do it for you:

  1. Download: https://github.com/koenpunt/chosen/archive/option_adding.zip
  2. Install packages: npm install && gem install bundler && bundle install
  3. Run build: grunt build (note, for this you'll need the grunt cli)


Or for your convenience, the compiled sources: https://jumpshare.com/v/Y87psfm7plf3Ap6ejpwF

share|improve this answer
Thanks for the clarifications on grunt (the note on the step 3). I've tried using npm install -g grunt, but that didn't come with the CLI (now i see grunt-cli is the right way). Also, thanks for the zip, seems to me it's a lot easier this way since (I believe) the coffeescript layer adds complexity for users that don't have experience with it or are more used to vanilla javascript. Thanks a lot! –  Zubzob Aug 13 '13 at 8:33
add comment

the documentation mentions this option:

Updating Chosen Dynamically


with this.


This can be combined with

// Add field


Adding this together to an example can be found at the jsfiddle: http://jsfiddle.net/E5X9x/

share|improve this answer
Ah, I see. I was expecting a functionality similar to this: xoxco.com/projects/code/tagsinput . Is this impossible to achieve through chosen? I mean, I know I could somehow fetch the val() of the chosen input, do a check, and eventually append it as an option after the user hits tab or enter, but I'm trying to see whether this possibility is built in (in the fork I mentioned). Thanks a lot for your input though! –  Zubzob Aug 13 '13 at 5:56
The fork @Zubzob is talking about (my fork) has the ability to add options using Chosen's interface. Documentation for this feature you can find here: github.com/harvesthq/chosen/pull/166 –  Koen. Aug 13 '13 at 7:54
add comment

Your Answer


