Can't get select2.js ajax working with asp.net webform

Question

I am trying to get an ASP.NET webform working with bootstrap 3 and the select2.js plugin. It doesn't return any errors or exceptions, it just sits there looking at me. Here is the page:

<div id="divDepartmentEntry">
            <label>Enter Name:<br /></label>
            <select id="e1" style="width:300px"></select>        
</div>

Here is the javascript:

$(document).ready(function () {
    $("#e1").select2();
});

$("#e1").select2({
    minimumInputLength: 2,
    ajax: { 
        url: "Default_handler2.ashx",
        cache: false,
        dataType: 'json',
        type: 'GET',
        data: function (term, page) {
            return {
                q: term // search term
            };
        },
        results: function (data, page) { 
            return { results: data };
        }
    },    
    formatResult: format,
    formatSelection: format

});

function format(item) {    
    return item.tag; 
}

Inside the generic handler:

    public void ProcessRequest (HttpContext context) {
    context.Response.ContentType = "text/plain";
    string result = "[{\"tag\":\"Smith\",\"id\":1},{\"tag\":\"Brown\",\"id\":14}]";
    context.Response.Write(result);
}

I can enter text in the opened input, but it does nothing in either IE8 (I know, don't get me started) or Chrome. Any ideas?

Answer 1

Try including the second call to .select2 that you have, inside the .ready instead:

$(document).ready(function () {
    $("#e1").select2({
        minimumInputLength: 2,
        ajax: { 
            url: "Default_handler2.ashx",
            cache: false,
            dataType: 'json',
            type: 'GET',
            data: function (term, page) {
                return {
                    q: term // search term
                };
            },
            results: function (data, page) { 
                return { results: data };
            }
        },    
        formatResult: format,
        formatSelection: format

    });
});

Also your handler should respond with a json content type:

context.Response.ContentType = "application/json";