Here In my code I create one user control. Put two textbox with autocompleteextender and submit button. After access two textbox , submit button Click event not fire. What is wrong in code. Please help me.When I put the updatepanel after that it’s not working. I need update panel because two textbox autopostback property is true.
<asp:UpdatePanel runat="server" ID="UpQuote" UpdateMode="Always">
<ContentTemplate>
<div id="Quote">
<table>
<tr>
<td class="tbltdForQuote">
</td>
</tr>
<tr>
<td>
<asp:Label runat="server" ID="lblTitle" Text="Get an instant quote" CssClass="lblForQuote"
Font-Size="Large"></asp:Label>
</td>
</tr>
<tr>
<td class="tbltdForQuote">
</td>
</tr>
<tr>
<td>
<asp:Label runat="server" ID="lblTo" Text="Pick-up Location e.g. Heathrow" CssClass="lblForQuote"></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:TextBox runat="server" ID="txtTo" AutoPostBack="true" autocomplete="off" CssClass="txtBoxForQuote" />
<ajaxToolkit:AutoCompleteExtender runat="server" BehaviorID="AutoCompleteEx1" ID="autoComplete1"
TargetControlID="txtTo" ServicePath="AutoComplete.asmx" ServiceMethod="GetCompletionList"
MinimumPrefixLength="1" CompletionInterval="1000" EnableCaching="true" CompletionSetCount="20"
CompletionListCssClass="autocomplete_completionListElement" CompletionListItemCssClass="autocomplete_listItem"
CompletionListHighlightedItemCssClass="autocomplete_highlightedListItem" DelimiterCharacters=";, :"
ShowOnlyCurrentWordInCompletionListItem="true">
<Animations>
<OnShow>
<Sequence>
<%-- Make the completion list transparent and then show it --%>
<OpacityAction Opacity="0" />
<HideAction Visible="true" />
<%--Cache the original size of the completion list the first time
the animation is played and then set it to zero --%>
<ScriptAction Script="
// Cache the size and setup the initial size
var behavior = $find('AutoCompleteEx1');
if (!behavior._height) {
var target = behavior.get_completionList();
behavior._height = target.offsetHeight - 2;
target.style.height = '0px';
}" />
<%-- Expand from 0px to the appropriate size while fading in --%>
<Parallel Duration=".2">
<FadeIn />
<Length PropertyKey="height" StartValue="0" EndValueScript="$find('AutoCompleteEx1')._height" />
</Parallel>
</Sequence>
</OnShow>
<OnHide>
<%-- Collapse down to 0px and fade out --%>
<Parallel Duration=".4">
<FadeOut />
<Length PropertyKey="height" StartValueScript="$find('AutoCompleteEx1')._height" EndValue="0" />
</Parallel>
</OnHide>
</Animations>
</ajaxToolkit:AutoCompleteExtender>
</td>
</tr>
<tr>
<td class="tbltdForQuote">
</td>
</tr>
<tr>
<td>
<asp:Label runat="server" ID="lblFrom" Text="Drop-off Location e.g.E1 (Postcode)"
CssClass="lblForQuote"></asp:Label>
</td>
</tr>
<tr>
<td>
<asp:TextBox ID="txtFrom" AutoPostBack="true" runat="server" autocomplete="off" CssClass="txtBoxForQuote" />
<ajaxToolkit:AutoCompleteExtender runat="server" BehaviorID="AutoCompleteEx" ID="AutoCompletetxtFrom"
TargetControlID="txtFrom" ServicePath="AutoComplete.asmx" ServiceMethod="GetCompletionList"
MinimumPrefixLength="1" CompletionInterval="1000" EnableCaching="true" CompletionSetCount="20"
CompletionListCssClass="autocomplete_completionListElement" CompletionListItemCssClass="autocomplete_listItem"
CompletionListHighlightedItemCssClass="autocomplete_highlightedListItem" DelimiterCharacters=";, :"
ShowOnlyCurrentWordInCompletionListItem="true">
<Animations>
<OnShow>
<Sequence>
<%-- Make the completion list transparent and then show it --%>
<OpacityAction />
<HideAction Visible="true" />
<%--Cache the original size of the completion list the first time
the animation is played and then set it to zero --%>
<ScriptAction Script="
// Cache the size and setup the initial size
var behavior = $find('AutoCompleteEx');
if (!behavior._height) {
var target = behavior.get_completionList();
behavior._height = target.offsetHeight - 2;
target.style.height = '0px';
}" />
<%-- Expand from 0px to the appropriate size while fading in --%>
<Parallel Duration=".2">
<FadeIn />
<Length PropertyKey="height" StartValue="0" EndValueScript="$find('AutoCompleteEx')._height" />
</Parallel>
</Sequence>
</OnShow>
<OnHide>
<%-- Collapse down to 0px and fade out --%>
<Parallel Duration="1">
<FadeOut />
<Length PropertyKey="hight" StartValueScript="$find('AutoCompleteEx')._height" EndValue="0" />
</Parallel>
</OnHide>
</Animations>
</ajaxToolkit:AutoCompleteExtender>
</td>
</tr>
<tr>
<td class="tbltdForQuote">
</td>
</tr>
<tr>
<td>
<asp:Button runat="server" ID="btnQuoteSubmit" Text="Get Quote >>" UseSubmitBehavior="false"
CssClass="QuoteButton" OnClick="btnQuoteSubmit_Click" CausesValidation="false" />
</td>
</tr>
<tr>
<td style="float: right">
<asp:HyperLink runat="server" ID="HyLogin" Text="Login to your account >>"></asp:HyperLink>
</td>
</tr>
</table>
</div>
</ContentTemplate>
</asp:UpdatePanel>
I found the answer after long search. Basically autocompleteextender not working in user control. because they use webmethod and it’s only working on web page not user control