I want to trigger the jquery autocomplete manually on keyup, only after pressing the asterisk "*" by the end of the input.
Here's what I did:
<input type="text" name="test" id="mainSearchBox">
var availableTags = [
"Perl",
"PHP",
"Python",
"Ruby"
];
$('input#mainSearchBox').keyup(function(){
var value = $('input#mainSearchBox').val();
if(value.substr(value.length - 1) == "*"){
$(this).autocomplete({
source: availableTags,
minLength:0
});
} else {
$(this).autocomplete("close");
}
});
Here, Try doing it like this :
var availableTags = [
"Perl",
"PHP",
"Python",
"Ruby"
];
$('input#mainSearchBox').autocomplete({
source: availableTags,
minLength: 0
});
$('input#mainSearchBox').autocomplete("disable");
$('input#mainSearchBox').keyup(function(e) {
var code = (e.keyCode ? e.keyCode : e.which);
switch (code) {
case 40: //down key
case 38: //up key
//add more cases for special buttons
return;
}
var value = $('input#mainSearchBox').val();
var last = value.substr(value.length - 1);
if (last == "*") {
var valToSearch = value.substr(0, value.length - 1);
$('input#mainSearchBox').autocomplete("enable");
$('input#mainSearchBox').autocomplete("search", valToSearch);
} else {
$('input#mainSearchBox').autocomplete("disable");
}
});
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<input type="text" name="test" id="mainSearchBox">
Have a look at :
What I have done :
autocomplete
on the textbox and then disabled it.*
, a. if it is, then enable autocomplete
and force search
on the text-box, with the input value without *
.
b. If it is not, then disable the autocomplete.