How To Call Server Side Code From AJAX client-side

Markup:

In the AutoCompleteExtender OnClientItemSelected property add the JavaScript method to be called: OnClientItemSelected=”AutoCompletedClientItemSelected”

Within the AutoCompletedClientItemSelected JavaScript method issue a __doPostBack(“AutoCompleteExtender”, sender._element.value); which will induce the postback to the server.

<script language="javascript" type="text/javascript">
 // postBack handler for AJAX AutoComplete Extender - onClientItemSelected 
    function AutoCompletedClientItemSelected(sender, e) {        
        __doPostBack("AutoCompleteExtender", sender._element.value);
    }     
    
</script>

        <div id="find">
            <div id="findbox">
                <span class="label">JHA Name</span>
                <asp:TextBox ID="tbJHAName" CssClass="namebox" runat="server" AutoComplete="Off"
                    Width="550px" Style="margin-top: 0px"></asp:TextBox>
            </div>
            <asp:AutoCompleteExtender ID="tbJHAName_AutoCompleteExtender" runat="server" Enabled="true"
                ServicePath="" ServiceMethod="GetJHANames" TargetControlID="tbJHAName" MinimumPrefixLength="3"
                UseContextKey="True" OnClientItemSelected="AutoCompletedClientItemSelected">
            </asp:AutoCompleteExtender>
            <a id="linkAdvancedSearch" class="advancedlink" href="Javascript:void(0)" onclick="ShowAdvanced(this);">
                Advanced Search</a>
        </div>

Code Behind Page:

Filter the EventTarget message sent from the JavaScript method in the Page_Load event.

protected void Page_Load(object sender, EventArgs e)
{
if (IsPostBack)
{
             // postBack handler for AJAX AutoComplete Extender - JavaScript call: AutoCompletedClientItemSelected
                if (Request.Form["__EVENTTARGET"] != null &&               
                Request.Form["__EVENTTARGET"] == "AutoCompleteExtender" &&
                Request.Form["__EVENTARGUMENT"] != null)
                {
                    // Emulate button click search
                    btnSearch_Click(null, null);

                }
}

More details here

Advertisements

One thought on “How To Call Server Side Code From AJAX client-side

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s