I am new to this and looked at other examples, but it’s unclear how to set the message “No matches” for the latest version of autocomplete http://docs.jquery.com/UI/Autocomplete when there are no results.
This is the code I'm using, can someone help write the rest, ideally so that it is clickable on the "suggestions" page.
<script>
$(document).ready(function() {
var data = [
{label: 'Yahoo', value: 'http://yahoo.com'},
{label: 'BMW', value: 'http://bmw.com'},
{label: 'Bing', value: 'http://bing.com'}
];
$("input#autocomplete").autocomplete({
source: function(request, response) {
var results = $.ui.autocomplete.filter(data, request.term);
response(results.slice(0, 10))},
focus: function (event, ui) {
$(event.target).val(ui.item.label);
return false;
},
select: function (event, ui) {
$(event.target).val(ui.item.label);
window.location = ui.item.value;
return false;
}
});
});
</script>
Thanks in advance.
UPDATE: I managed to put the patch together, but how can I embed a working link in a message?
<script type='text/javascript'>
$(window).load(function(){
var data = [
{label: 'Yahoo', value: 'http://yahoo.com'},
{label: 'BMW', value: 'http://bmw.com'},
{label: 'Bing', value: 'http://bing.com'}
];
$("input#autocomplete").autocomplete({
source: function(request, response) {
var results = $.ui.autocomplete.filter(data, request.term);
if (!results.length) {
$("#no-results").text("<a href=\"/\">No results found!</a>");
} else {
$("#no-results").empty();
}
response(results.slice(0, 10));
},
focus: function (event, ui) {
$(event.target).val(ui.item.label);
return false;
},
select: function (event, ui) {
$(event.target).val(ui.item.label);
window.location = ui.item.value;
return false;
}
});
});
</script>