I am using an autocomplete extender on my asp.net webpage to fetch data when a user starts typing a last name. Only when it seems there are a ton of results being returned, it never lets the user select an item from the drop down. It searches for a last name by state so if a user types in a 2 letter last name such as "Li" there could be many results returned from this. Is there a way to allow more results without it auto-closing?
<asp:AutoCompleteExtender ID="AutoCompleteExtender" runat="server"
DelimiterCharacters="" Enabled="True" ServicePath="AutoComplete.asmx"
ServiceMethod="GetCompletionList" TargetControlID="NameTextBox"
UseContextKey="true" ContextKey="StateDropDown"
onclientitemselected="getSelected"
ShowOnlyCurrentWordInCompletionListItem="True" CompletionInterval="100"
MinimumPrefixLength="2" CompletionListElementID="autocompleteDropDownPanel"
CompletionListCssClass="style101" OnClientShown="checkFocusOnExtender">
</asp:AutoCompleteExtender>
We have gone through same situation like this , i can provide you with the 2 solutions
Solution 1: try to Add the Css for the Extender in such a way that it scrolls , you can achieve this by applying something like as follows:
.mycustom {
Overflow: auto;
height: 100px;
}
Solution 2 : you can set the you could set the CompletionSetCount property of this control, it will show the less count items in dropdownlist. Default is 10
. but there is a downside for this solution there are chances that user may not able to find his desired result in it or he wants to explore more other options . for this what you can do is :
try to keep another button such as More
and triggering that button you can get another set of results.
here is the sample how to trigger the auto extender
from the button
<asp:Button ID="yourtriggerbutton" runat="server" Text="Get Next Set of
Results" OnClientClick="javascript:displayautocomplete()"/>
Here is your trigger
function
<script type="text/javascript">
function displayautocomplete() {
var autoComplete = $find("AutoCompleteExtender");
autoComplete.get_element().focus();
autoComplete._textBoxHasFocus = true;
autoComplete.get_element().value =" ";
Sys.Net.WebServiceProxy.invoke(autoComplete.get_servicePath(),
autoComplete.get_serviceMethod(),
false,
{ prefixText: " ", count: autoComplete._completionSetCount },
Function.createDelegate(autoComplete, autoComplete._onMethodComplete),
Function.createDelegate(autoComplete, autoComplete._onMethodFailed),
”,
5000);
$common.updateFormToRefreshATDeviceBuffer();
}
</script>
First you need to find the extender. Then set focus on the extender.
Without setting the focus on the extender nothing will work.
After the focus setting, you need to use the Sys.Net.WebServiceProxy.invoke
method which will invoke the auto complete. The last thing to do is to
use the $common.updateFormToRefreshATDeviceBuffer
method which
is registered by the AutoCompleteExtender in order to make
updates to form elements and to refresh their document buffer
to what is showing live in the browser.
You can read more about this solution from here ,