Ankita Agrawal
Ankita Agrawal

Reputation: 504

show list without tying in select2 ajax jQuery

I am using select2 ajax based jQuery to show dropdown. Its working perfectly. Now I want when user clicks on the select2 box without typing then it will show 10 records. I am using InitSelection, but it didn't show anything. Code is:-

var tags = [
            {'id':1, 'text':'Ben'},  
            {'id':22, 'text':'Andrea'}
    ];
    $('#form_fb_q').select2({       
        minimumInputLength: 2,
        ajax: {
            url: "/provisioning/api/facebook/default/",
            cache: true,
            dataType: 'json',
            quietMillis: 250,
            data: function (term, page) {
                return {
                    q: term,
                    method: $('input[name=fb_search_by]:checked').attr('method')
                };
            },
            results: function (data, page) {
                return {
                    results: data.data
                };
            }
        },
        formatResult : function (entry) {
            var markup = "<table class='entry-result'><tr>";
            markup += '<td class="entry-image"><img src="http://graph.facebook.com/' + entry.id + '/picture?type=square"/></td>';
            markup += "<td class='entry-info'><div class='entry-name'>" + entry.name + "</div>";
            markup += "<div class='entry-likes'>" + entry.likes + " likes</div>";
            markup += "</td></tr></table>";
            return markup;
        },
                    initSelection: function(element, callback) {
                       // alert("hahaha");
                    callback(tags);
                    },
        formatSelection : function (entry) {
            return entry.name;
        },
        dropdownCssClass: "bigdrop",
        escapeMarkup: function (m) { return m; }

    });

Input box is :-

 <input id="form_fb_q"  name="fb_q"  value="111" >

Please help me where I am going wrong.

Upvotes: 2

Views: 2334

Answers (1)

xeo
xeo

Reputation: 832

change minimumInputLength: 2 to minimumInputLength: 0

this way your ajax will be called on initial drop down of the control. your current configuration is only making the ajax call once there are two letters typed in.

Upvotes: 5

Related Questions