Reputation: 504
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
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