A simple jquery ui autocomplete
by Ea Bangalore
HTML
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css">
<div class="ui-widget">
<label for="tags">Search: </label>
<input id="tags">
</div>
JavaScript
var runIndex = 0;
function simulateAjaxResponse(){
runIndex++;
var availableTags = [
"john"+runIndex,
"khair"+runIndex,
"compton"+runIndex,
"Jordan"+runIndex,
"Micheal"+runIndex,
"Peter"+runIndex
];
if(runIndex % 2 == 0){
return {"data":{"list":availableTags}};
}else{
return {"data":'no data'};
}
}
$(function() {
setInterval(function(){
var resp = simulateAjaxResponse();
console.log('resp..',resp);
try{
var list = resp['data']['list'];
$('#tags').autocomplete({
source: list,
minLength: 0,
}).focus(function () {
$("#tags").autocomplete("search");
});
}catch(e){
$('#tags').prop('disabled',true);
console.log('no data...............');
}
},9000);
});