I'm trying to have a No Results message appear in the dropdown menu if there are no results. So for instance, if I type in ABCD into the text field, and there is no entity that matches, the message No Results. will be displayed.
After looking through stackoverflow for the various different ways of accomplishing this, and trying a few of them, I still can't get it to work.
How can I add a No Results message to the dropdown menu when no results are found?
jQuery:
$element.autocomplete({
source: function (request, response) {
$.ajax({
url: thUrl + thQS,
type: get,
dataType: json,
cache: false,
data: {
featureClass: P,
style: full,
maxRows: 12
},
success: function (data) {
response($.map(data, function (item) {
if (data.indexOf(item) === -1) {
return { label: No Results. }
} else {
return {
label: item.Company + ( + item.Symbol + ),
value: item.Company
}
}
}));
}
});
},
minLength: that.options.minLength,
select: function (event, ui) {
reRenderGrid();
}
});
I have tried adding an if() statement with the following but that didn't work.
if (data.length === 0) {
// Do logic for empty result.
}
I am able to overwrite the first entry with the text No Result if I do the following...
if (data.indexOf(item) === 0) {
return {
label: No Results.
}
...but if I set data.indexOf(item) === -1 nothing shows up.
I just recently tried the following, and when there is no data, it goes into the loop, however, No Results is not being displayed in the menu:
success: function (data) {
response($.map(data, function (item) {
return {
label: item.Company + ( + item.Symbol + ),
value: item.Company
}
}));
if (data.length === 0) {
label: No Results.
}
}
I have also attempted to use the below example from Andrew Whitaker with no luck:
ANDREW WHITACKER'S FIDDLE: http://jsfiddle.net/J5rVP/128/
SOURCE: http://blog.andrewawhitaker.com/2012/10/08/jqueryui-autocomplete-1-9/
