JQuery Select2 Can't select option

Question

I have problem with Select2 . Everything works almost fine, except i can't select any option. I'm using select2 3.5.3, KnockoutJS, CoffeeScript and JQuery. My select2 code:

generateSelect3 =->
    return '<input data-bind="select2: {
        data:{ results: _.available, text: \'text\'},
        minimumInputLength: 3,
        allowClear: true,
        }" class="select2"></select>'

All files are called. I have working customized select2. It's initializing code:

generateSelect2 =->
    return $('<div class="subcontainer"><input type="text" class="input- 
        xxlarge" data-bind="select2ex: {url: (_.params && _.params.url || 
        undefined), value: value, text: text, options: _.params}"></div>');

Answer 1

Go to this link . You need to link only 2 files. Css on Head and Js on footer.

Call your personal js file after select2.js, and you must call jQuery.js before select2.js .

Use the below code on your file.

$(document).ready(function () {
    $(".category").select2({
        placeholder: 'Category',
        tags: true,
        width: 'resolve'
    });
    $(".sub-category").select2({
        placeholder: 'Sub Category',
        tags: true,
        width: 'resolve'
    });

});

Answer 2

Problem solved:

return $('<div class="subcontainer"><select
        class="input-xxlarge"
        data-bind="options: _.available,
        optionsText: $.ehr.CodedWidget.formatSelectText,
        optionsValue: function(item) { 
        return item && item.value || (item.value == 0 ? item.value + \'\' : \'\') },
        select2ex: {
        value: value,
        }"></select></div>')