1
votes

I am using the jQuery autocomplete plugin. Is there a way that when a user enters a textbox (that is wired up to have autocomplete) the list appears with the top alphabetical items? Some sort of trigger?

jQuery Code

$('.someTextbox').autocomplete({
source: function (request, response) {
$.ajax({
url: serviceUrl + "/AddDocumentLinesService.svc/GetLineTypes",
contentType: "application/json; charset=utf-8",
dataType: "json",
cache: false,
data: {
maxRows: 10,
textStartsWith: request.term
},
success: function (data) {
response($.map(data, function (item) {
return {
label: item.LineTypeCode + ' - (' + item.Description + ')',
value: item.LineTypeCode
}
}));
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert(textStatus);
}
});
}
});

I would like it so that the second the user enters the '$('.someTextbox')' textbox the list appears.

3

3 Answers

2
votes

Try:

 $('.someTextbox').focus(function() { $(this).search(); });

According to the documentation, .search() triggers the search manually. You can also set options.minChars to 0 and the options.delay to something small, which should also work. See: http://docs.jquery.com/Plugins/Autocomplete/autocomplete#url_or_dataoptions

1
votes

maybe you can try setting the minChars option to 0, and have GetLineTypes check for the length of the given string. if it's 0-length- return first alphabetical items.

another option is to wire to the focus event of the textbox and to trigger the autocomplete functionality manually. maybe you can 'trick' the autocomplete with something like this:

$('.sometextbox').focus(function() {
   if ($('.sometextbox').val().length ==0) { 
   //no text entered yet
   $('.sometextbox').val('  '); //insert 2 white spaces in order to trigger the autocomplete
}
});
0
votes

All the answers are right.I'm adding this since minChars is deprecated in newer versions.
Use minLength.
Set minLength : 0
Also you might consider using a button next to the textfield which kind of acts like a drop down and toggle for all available options.
Happy Coding!

Edit
Also since you are loading the whole list, you can make delay as 0,overriding existing behavior of delay which you might have mentioned.

$('input#textboxid').autocomplete('search','','delay',0);