Panel DefaultButton이 AJAX Toolkit에 의해 확장 된 경우 작동하지 않습니다. AutoComplete

Question

ASP.NET Panel을 사용하여 TextBox와 같은 일부 컨트롤에 대해 Default Button을 설정하고 있지만 AJAX Control Toolkit의 AutoCompleteExtender로 인해 작동하지 않는 것처럼 보입니다. Pls help ..!

코드는 다음과 같습니다 :

<asp:Panel ID="pnlSearchBox" runat="server" class="search-main-box" DefaultButton="lnkSearch"> 
     <asp:TextBox ID="txtLocation" runat="server" CssClass="input-field" MaxLength="200" style="width: 182px; margin-bottom: 7px;"></asp:TextBox> 
     <ajaxToolkit:AutoCompleteExtender runat="server" BehaviorID="AutoCompleteEx" ID="aceLocation" TargetControlID="txtLocation" 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" /> 
         <%-- Expand from 0px to the appropriate size while fading in --%> 
         <Parallel Duration=".4"> 
          <FadeIn /> 
          <Length PropertyKey="height" StartValue="0" EndValueScript="$find('AutoCompleteEx')._height" /> 
         </Parallel> 
        </Sequence> 
       </OnShow> 
       <OnHide> 
        <%-- Collapse down to 0px and fade out --%> 
        <Parallel Duration=".4"> 
         <FadeOut /> 
         <Length PropertyKey="height" StartValueScript="$find('AutoCompleteEx')._height" EndValue="0" /> 
        </Parallel> 
       </OnHide> 
      </Animations> 
     </ajaxToolkit:AutoCompleteExtender> 
     <div class="btn-search"><asp:LinkButton ID="lnkSearch" runat="server" class="btn-search-bg" OnClick="lnkSearch_Click"><span>Search</span></asp:LinkButton> 
     </div> 
</asp:Panel> 

Answer 1

과 같이 수행

<asp:TextBox onkeydown="KeyDownHandler();" ID="txtLocation" runat="server" 
    CssClass="input-field" MaxLength="200" style="width: 182px; margin-bottom: 7px;"> 
</asp:TextBox> 

이 페이지 헤드 태그에 스크립트 태그에 이것을 추가 :

function KeyDownHandler() 
{ 
    if (event.keyCode == 13) 
    { 
     event.returnValue=false; 
     event.cancel = true; 
     document.getElementById('<%=lnkSearch.ClientID%>').click(); 
    } 
} 

편집을 jQuery를 사용하는 위 코드와 jquery 사이에는 별다른 차이가 없습니다. :

function KeyDownHandler() 
{ 
    if (event.keyCode == 13) 
    { 
     event.returnValue=false; 
     event.cancel = true; 
     $('#<%=lnkSearch.ClientID%>').click(); 
    } 
}