AutoCompleteExtender control cannot be found by JavaScript .NET 4.0

See more:

Javascript

.NET

.NET4

, +

Hi guys,
I am trying to set the ContextKey of an AutoComplete extender by Javascript but the control cannot be found. I am using .Net 4.0 and the AutoCompleteExtender resides inside an Accordion Control.

I have tried to using
1)

$find('autorextenderID').set_contextKey

2)

$find('autorextender''s BehaviourID').set_contextKey

3)

var e = document.getElementById('<% = AutoCompleteExtenderPortOfUnlading.ClientID %>');
 e.set_contextKey($('#<%= ddlDestinationCountry.ClientID %>').val());

Also played with the

<httpRuntime encoderType />

to disable the encoding on the Web.Config And none of them worked.
How can I set the ContextKey on properly?
Thanks.

<div class="row">
    <div class="label">
        <asp:Label ID="lblPortOfUnlading" runat="server"  style="display:none;" Text="Port of Unlading:"></asp:Label>
    </div>
    <div class="value">

        <asp:TextBox ID="txtPortOfUnlading" runat="server" style="display:none;" onkeyup="SetContextKey();"  Width="256px" AutoCompleteType="Search"></asp:TextBox>

         <ajaxToolkit:AutoCompleteExtender
        runat="server"
        ID="AutoCompleteExtenderPortOfUnlading"
        BehaviorID="AutoCompleteEx"
        DelimiterCharacters="" Enabled="True"
        ServiceMethod="GetPortOfUnladingByCountry"
        CompletionListCssClass="completionListElement"
        CompletionListItemCssClass="listItem"
        CompletionListHighlightedItemCssClass="highlightedListItem"
        ServicePath=""
        TargetControlID="txtPortOfUnlading"
        UseContextKey="True"


        ></ajaxToolkit:AutoCompleteExtender>

    </div>
</div>



    <script type="text/javascript" language="javascript">

     function SetContextKey() {
         var e = document.getElementById('<% = AutoCompleteExtenderPortOfUnlading.ClientID %>');
         e.set_contextKey($('#<%= ddlDestinationCountry.ClientID %>').val());

    }