Hi,
I'm having a weird issue with the AutoCompleteExtender. I use it for 3 different textboxes to return City and State. In each of the textboxes you can never select one of the values in the list with your mouse, and its a different position for each textbox. For one textbox you can never select the 3rd value in the list, for another textbox it's the 5th value, and for the other textbox its the 17th value. The user can only select that particular value in the list by using the arrow key on the keyboard. This only occurs when in compatibility mode, but on our server the application will always be running in compatibility mode. I haven't been able to find anyone else that's had the same issue. Has anyone else experienced a similar issue? Below is the code for one of the textboxes:
HTML:
<asp:TextBoxID="txtBargeSiding"runat="server"Width="175px"MaxLength="100"CssClass="TextBoxes"TabIndex="20"></asp:TextBox>
<asp:CustomValidatorID="cvBargeSiding"runat="server"ControlToValidate="txtBargeSiding"ErrorMessage="The Barge Siding entered is invalid"Display="Static"Text="*"ForeColor="Red"Font-Size="Medium"Font-Bold="true"ValidateEmptyText="True"></asp:CustomValidator>
<asp:RequiredFieldValidatorID="BargeSiding_Validator"runat="server"ForeColor="Red"Font-Size="Medium"ErrorMessage="Barge Siding is a required field"ControlToValidate="txtBargeSiding"Display="Static"Text="*"Font-Bold="True"></asp:RequiredFieldValidator>
<Ajax:AutoCompleteExtenderID="BargeSidingPredictiveText"
OnClientItemSelected="OntxtBargeSidingChange"
runat="server"
CompletionListCssClass="autocomplete_completionListElement"
CompletionListHighlightedItemCssClass="autocomplete_highlightedListItem"
CompletionListItemCssClass="autocomplete_listItem"
CompletionSetCount="20"
ServicePath="PredictiveTextLookup.asmx"
ServiceMethod="GetCityStateList"
TargetControlID="txtBargeSiding"
UseContextKey="False"
EnableCaching="true"
MinimumPrefixLength="2"
FirstRowSelected="true"
CompletionInterval="10">
</Ajax:AutoCompleteExtender>
<asp:HiddenFieldID="hdnBargeSiding"Value="0"runat="server"/>
Javascript:
function OntxtBargeSidingChange(source, eventArgs) {
var results = eval('('+ eventArgs.get_value() + ')');
document.getElementById('<%= txtBargeSiding.ClientID %>').value = results.ReturnText;
document.getElementById('<%= hdnBargeSiding.ClientID %>').value = results.ReturnValue;
}
Code-behind:
txtBargeSiding.Attributes.Add("onblur","if (document.getElementById('"& txtBargeSiding.ClientID &"').value.length == 0) { document.getElementById('"& hdnBargeSiding.ClientID &"').value = '0';}")
txtBargeSiding.Attributes.Add("onchange","document.getElementById('"& hdnBargeSiding.ClientID & "').value = '0';")