I use twitter bootstrap typeahead for displaying some data from server, the problem is when user types an letter typeahead makes an ajax call to server and when I try to type 2 or 3 letters fast it will make 2 or 3 ajax calls to server, is there a possibility to make an delay when user is typing letters to make only one ajax call to server
my code at the moment:
$('#SEARCH-INPUT').typeahead({ source: function (query, process) { jQuery.ajax({ type: "GET", url: "/organisations/search", data: {search_name: $("#SEARCH-INPUT").val()}, beforeSend: function(){ $("#SEARCH-LOADING").show(); }, success: function (data) { organisations = []; organisations_hash = {}; $.each(data, function(i, item){ organisations_hash[item.name.toUpperCase()] = item.id; organisations.push(item.name); }); organisations.sort(); $("#SEARCH-LOADING").addClass("hidden"); process(organisations); }, error: function (){ alert("error");}, async: false }); } ,updater: function (item) { $("#SEARCH-INPUT").val(item); $("#SEARCH-BUTTON").click(); return item; } ,items: 9 ,minLength: 1 });
Use this solution:
(function() { var timeout; $('[name="fill"]').typeahead({ source: function(value) { if (timeout) { clearTimeout(timeout); } timeout = setTimeout(function() { alert(value); }, 300); } }); })();
See in action:
http://jsfiddle.net/nnPVn/
setTimeout and clearTime works fine!
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With