I would like to show you how Chosen can be quickly integrated into your EmberJs application together with Twitter Bootstrap.

If you just want a solution, here is my gist: https://gist.github.com/andriybuday/7849057

Otherwise read a short story with some comments and “excuses” from my side.

I’m currently working on web application. We use JavaScript MVC web framework called EmberJs. It is very cool framework, and I will write about it more in the future. Ember has small set of views and input-helpers. Just using them is not always enough to build solid and rich application. Fortunately there are tons of controls available online, and it is quite easy to write your own controls with Ember.

Most of online available controls/plugins are based on jQuery (no surprises, of course) and they use plain javascript objects. Ember wraps javascript objects into Ember.Object, so it allows for data binding, data tracking and other advanced features, but on other hand it makes impossible to use vast majority of web components right away. You need to adapt them in order to to use them with Ember.

Having component created with Ember would result in application-specific html-tag, that would use JavaScript logic defined by you. Something like: <my-own-html-tag… that does and shows what you want.

Chosen. One of the controls we wanted to use was Chosen. “Chosen is a jQuery plugin that makes long, unwieldy select boxes much more user-friendly.” It allows you to have nice multi-selects that look like one below:

I’ve found a quick way to integrate chosen with Ember. As per me easiest way would be to utilize existing view called Ember.Select. You can embed it into your new component.

To be completely fair, my solution is not perfect, since I needed to hack html generated by Ember and manually handle selection/deselection of elements from the list, but solution below allowed me to achieve results fast without much code.
(Other option would be to avoid using Ember.Select and then play a lot with defining proper view for your component.)

If you are one of my constant readers, it might be bit surprising that I’m writing about web, and not even from .NET perspective. But believe me, you can expect more. I wanted to do more programming in other languages. This is why I struggled to try many programming languages. But thanks to some coincidences I currently code in javascript most of my time.