bold matched word in autocomplete jquery with loader
<div class="col-md-12 search_panel">
<form>
<input type="text "class=>"txt-search" name="search">
<span class="autocomplete-animation" ><img id="ajaxanimation" src="../assets/loader.gif")/>< /span>
</form><form>
<input type="text "class=>"txt-search" name="search">
<span class="autocomplete-animation"
</div>
<script >
$(document).ready(function(){
var termTemplate = "<span class='ui-autocomplete-term'>%
var availableTags =
[
"ActionScript",
"AppleScript",
"Asp",
"BASIC",
"C",
"C++",
"Clojure",
"COBOL",
"ColdFusion",
"Erlang",
"Fortran",
"Groovy",
"Haskell",
"Java",
"JavaScript",
"Lisp",
"Perl",
"PHP",
"Python",
"Ruby",
"Scala",
"Scheme"
];
source: function(req, responseFn) {
var re = $.ui.autocomplete.escapeRegex(
var matcher = new RegExp( "^" + re, "i" );
var a = $.grep( availableTags, function(item,index){
return matcher.test(item);
});
responseFn( a.slice(0, 5) );
},
select: function(event, ui){
$('.txt-search').val(ui.item.
$(".search-form").submit()
},
search : function(){$('.autocomplete-
open: function (e, ui) {
var
acData = $(this).data('autocomplete'),
styledTerm = termTemplate.replace('%s', acData.term);
acData.menu.element.find('a')
.each(function () {
var me = $(this);
count = $(styledTerm).text().split("")
check_element=""
$($(me).text().split("")).
if(index==0 && count==1){
check_element="<span class='ui-autocomplete-term'>"
}
else if(index==0){
check_element="<span class='ui-autocomplete-term'>"
}else if(index==count-1){
check_element+=element+"</
}else{
check_element+=element
}
});
$(me).html(check_element);
setTimeout(
function()
{
//do something special
$('.autocomplete-animation').
}, 1000);
});
}
});
});
</script>
Comments
Post a Comment