Add functionality to allow templates #692

wants to merge 5 commits into


Closed in Chosen Progress


I've added the functionality to allow templates in dropdowns by using the data attribute on options and a template option when setting up chosen.

I've compiled the code and provided jquery and prototype examples.

Below is the jQuery example.


<select data-placeholder="Choose your favorite candy..." class="chzn-select-template-example" style="width:350px;" tabindex="11">
  <option value=""></option>
  <option data-type="chocolate" data-user-rating="1.8">M&Ms</option>
  <option data-type="fruity" data-user-rating="1">Starburst</option>
  <option data-type="fruity" data-user-rating="7">Skittles</option>
  <option data-type="chocolate" data-user-rating="9">Reese's</option>
  <option data-type="chocolate" data-user-rating="10">Snickers</option>

Initialize It:

  template: function (text, templateData) {
    return [
      "<span style='float: right'>User Rating: " + templateData.userRating + "</span>",
      "<div>" + text + "</div>",
      "<div><i>type of candy: " + templateData.type + "</i></div>"         



Thanks to Elliott Wood for code reviewing and to Select2 for inspiration.


Would love this.


This would definitely be much nicer than my current solution of hacking the data I need into Chosen.


I would love to see this added to Chosen - great feature, and far better than hacking.

stof commented Sep 3, 2012



👍 +1

Kevlys commented Sep 11, 2012

👍 +1


This and functionality for adding custom options are pretty neat but not supported when chosen is not loaded (e.g. plain <select>). And I think that's a reason for the holdback of merging this kind of functionality.
But of course only @pfiller's knows what the real reasons are :)


@koenpunt Thanks! If chosens not loaded the attributes on the options are still valid and usable by jQuery.


@cjstewart88 What I mean is that when JavaScript is disabled, the extra functionality is not available, so users are missing out. And therefore it may be better to keep this 'addons' in their own branches/repositories.


I think if JavaScript is disabled the user should simply be presented with an animated GIF of a dinosaur.

On Sep 11, 2012, at 8:00 AM, Koen Punt wrote:

@cjstewart88 What I mean is that when JavaScript is disabled, the extra functionality is not available, so users are missing out. And therefore it may be better to keep this 'addons' in their own branches/repositories.

Reply to this email directly or view it on GitHub.


@koenpunt hmm, but if JavaScript is disabled the entire chosen plugin doesn't work, not sure I'm following why it shouldn't be included in the library.

broox9 commented Sep 11, 2012

+1 users disabling javascript should be used to a large scale lack of functionality. I'd love this in my projects also. @brianfeister make that a spinning dinosaur in that animated gif and you've got a deal!


@cjstewart88 True, the plugin doesn't work, but as Chosen is a selectbox enhancer and not an extender, this doesn't take away any of the functionality, only the experience.

@koenpunt koenpunt referenced this pull request Sep 25, 2012

Image option #831


I'm sorry, but i can't use this functionality. i copy the same code of @cjstewart88 but, for me no show the style, in firebug any error show, and i don't know what can i do.

so, what can i do?


I noticed it was mentioned select2 was inspiration; but, this really nice functionality to have in the core library that really makes use of complex select options very easy. Thanks!

Epexa commented Dec 6, 2012

The guys in the 0.9.10 version that runs this method? Or to prescribe what that CSS style?

thomasf1 commented Jan 4, 2013

I´ve updated cjstewart88´s solution:

  1. The templates are used for displaying not only in the dropdown, but also for selected values and the default values (basically everyhere a option is displayed)
  2. The Template gets handed the text and the value of an option
  3. Updated to work with the latest Version



Any update on this @pfiller?

@pfiller pfiller referenced this pull request May 20, 2013

Adding custom html cells. #1199

gitlost commented Jun 12, 2013

+1 (Plus I think it should also use @thomasf1's suggestions above)


Any chance on this getting merged in @pfiller, @kenearley and @stof?

twisk commented Aug 5, 2013




Onumis commented Nov 13, 2013

Merge this in already! :(


Short question about those templates:
Is it possible to get those data Values into the selected field? So not only inside the drop-down but also when I selected one that it will show the data?

@tjschuck tjschuck referenced this pull request Nov 20, 2013

Custom html #1659


Is any progress?

fltiago commented Dec 4, 2013

@oachkatzl +1 to the last comment

Is there any date when it will be merged?


Wanna know too!!!!


how has this gone ignored for 2 YEARS. BUMP!!

This was referenced Feb 18, 2014
fellix commented Mar 6, 2014




Such a useful addition, sad it's been left hanging for so long even with so many people consistently requesting it. Please merge this.


Today I was converted, I will no longer use chosen.js, we are deprecating it, switching to Select2, it supports this templating as well as searchable keywords.


Select2 is too heavy.

gonimar commented Apr 16, 2014





This is brilliant! +1


This would really help us out. +1

ytolsk commented Aug 19, 2014

+1 to this. Can't believe that the work is done and it's not being merged in. Really sad to see - we'll steer away from using chosen in the future.


As much as I like using chosen.js I am now slowly switching to using Select2.js

@tjschuck tjschuck referenced this pull request Aug 26, 2014

Allow images in select #2055


+1 on this.

yuvii commented Sep 10, 2014



Hi guys,

I need to use jquery-chosen library in my project, but I can't because of this issue.

I could, however, use this project instead:

I just want to know if there's any plans to fix this in the recent future, or I should use the other project.

This is really important for me, because later on the migration might be really hard to do. Just some rough idea when can we expect to have this fixed.

Thanks a lot.

yuvii commented Sep 23, 2014

@paranoiabla or you can just use chosen and apply this patch to allow custom templating


@yuvii I can't really because I'm using webjars, so It has to be a webjar project. I really can't believe that an issue with a pull-request attached to it still open after 2.5 years... that's just embarassing..

yuvii commented Sep 23, 2014

@paranoiabla first of all - chosen hasn't been updated at all for a couple of years now. It's their decision to make. If you want, there's select2 which is a fork that is still in developement.

Secondly - I'm not familiar with webjars, but doesn't it let you add your own custom javascript files?



chosen hasn't been updated at all for a couple of years now.

This is empirically false, and disrespectful to the many people who have contributed to Chosen voluntarily and in their spare time.

Open source is people. Be nice.

yuvii commented Sep 23, 2014

@tjschuck Sorry, I wasn't trying to offend anyone. I think chosen is amazing. It's a fantastic piece of work, and I have used it myself for a few projects, including expanding a few parts of it (so I've seen and edited the source code, and I know how good it is). I really admire what you guys did here, and always preferred chosen over similar libraries that are overly-complex and feature heavy (such as select2)

It's just that in the last few years I haven't noticed any major updates or new features to the library. Perhaps I haven't noticed them, or it was only for a small period of time. Anyway, all I meant was that he shouldn't be mad that you guys don't add new features like this, because you might be focusing on other projects, and that he should just resolve the issue himself. Again, sorry for my phrasing, I can be terrible at it


I guess the biggest problem is the silence about this issue. It seems to be pretty major, but when I ask if there's any plans to fix it in the near future, then all I get is silence. A simple yes or no would be sufficient. Without an answer I am unable to make a decision if I should use chosen at all.


@yuvii 👍 ❤️

@paranoiabla You describe this as a "major issue" that needs "fixing", but it's not that at all -- it's a feature addition, not a bug fix.

There are many reasons a feature might not be immediately merged. But the most likely reason is just that this is a complicated addition with a big diff that will require full code review, QA, documentation, and future maintenance, and someone just hasn't had the free time to do all of those things quite yet.

If you want to use this feature as is, dowload the source, apply the patch, and use it. Just as we've made the master branch of Chosen open source, this contributor has made his code just as freely available for you to use.


@tjschuck My question is still unanswered, so I will just assume that it's too complicated to merge a pull request for 2 and a half years so it will not be done in the near future :)

sshishov commented Mar 6, 2015

It seems that due to this delay all possible users of the plugin will migrate to select2 in spite of it is heavy but it more configurable.


Chosen vs Select2: make up your mind ;)


Is this pull request merged yet? Because I could not get this work on Chosen v1.4.1 (latest for now).


No it's not, sorry man. Check out select2 if you need templating.

On Mar 24, 2015, at 10:19 PM, Đinh Quang Trung wrote:

Is this pull request merged yet? Because I could not get this work on Chosen v1.4.1 (latest for now).

Reply to this email directly or view it on GitHub.

pfiller commented Sep 19, 2016

In an effort to try and get Chosen's repository under control and to best serve the people who use the tool, we're closing pull requests that add new functionality. For the time being, we're only merging bug fixes and functionality changes that are inline with Chosen's current scope. This doesn't mean we won't ever consider this functionality, but it does mean that we're being realistic about the time constraints the project maintainers have to give to this project.

Sorry this has sat open so long @cjstewart88. The hope is that by getting things under control, we can get to a place in the future where we can once again start adding new functionality (at which point we'd come back to closed PRs like this). Thanks for your patience and understanding!

@pfiller pfiller closed this Sep 19, 2016

4 years back it was opened and now closed due to lack of time?! LOL sounds rediculous


This would be awesome! Why wasn't merged?

rafwell commented Jan 20, 2017

+1 from brazilian developers! thanx!

groovenectar commented Mar 16, 2017 edited

Here is another way to do it for now...

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment