What is the best way to use Chosen in a popover with Meteor?
I have a calendar, and when I click on event a popover open with a little form to update event.
Here is my template calendar:
<template name="bookingCalendar"> <section> <div class="col-md-12"> <div id="calendarMain"></div> </div> </section> {{> bookingCalendar_popover}} </template> My popover template:
<template name="bookingCalendar_popover"> <div id="bookingCalendar_popover" style="display: none"> <form class="form-horizontal" role="form"> <div class="col-md-12 col-lg-6"> {{> objectIndividual_edit id = 'individual' label = 'Patient'}} </div> </form> </div> </template> And my object:
<template name="objectIndividual_edit"> <div class="objectRow"> {{> objectLabel label=label id=id}} <div class="objectEdit"> <select id="{{id}}" name="{{id}}" class="form-control objectIndividual"> <option value="0"></option> {{#each individuals}} <option value="{{_id}}">{{firstName}} {{lastName}}</option> {{/each}} </select> </div> </div> </template> I open my popover in
Template.bookingCalendar.rendered And I initialize chosen here.
Template.objectIndividual_edit.rendered = function() { var input = $('.objectIndividual'); input.chosen({disable_search_threshold: 10}); }; Template.objectIndividual_edit.helpers({ individuals: function(){ return Individual.find({deactivatedAt: {$exists: false}}, {sort: {firstName: 1, lastName: 1}}); } }); Without chosen the select is correctly filled. But when I use chosen, the select is broken.

So, anyone had an idea or a example to do that?