textbox fires TextChanged event twice and postback twise with first postback status aborted

Question

I have a text box availableItemsFilterTextBox , which purpose is to provide filtering data for grid view availableItemsGridView .

<asp:TextBox runat="server" ID="availableItemsFilterTextBox" AutoPostBack="True" OnTextChanged="availableItemsFilterTextBox_TextChanged"></asp:TextBox>

The grid view availableItemsGridView is placed within:

1. an UpdatePanel and with UpdateMode set to "Conditional" and Trigger set to TextChanged event,

2. and TabControl with AutoPostBack="true"

    <ajaxToolkit:TabContainer runat="server" ID="patternTabContainer" ActiveTabIndex="0" AutoPostBack="false" OnActiveTabChanged="Tabs_ActiveTabChanged"> <ajaxToolkit:TabPanel runat="server" ID="availableItemsTabPanel" meta:resourcekey="itemSelectionPanelResource"> <ContentTemplate> <asp:UpdatePanel ID="availableItemsUpdatePanel" runat="server" UpdateMode="Conditional"> <Triggers> <asp:AsyncPostBackTrigger ControlID="availableItemsFilterTextBox" EventName="TextChanged" /> </Triggers> <ContentTemplate> <asp:Panel ID="Panel1" runat="server" ScrollBars="Auto" Style="max-height: 400px; margin: 5px 5px 5px 5px;"> <asp:GridView ID="availableItemsGridView" runat="server" CssClass="dataGrid" ShowHeaderWhenEmpty="True" DataKeyNames="skuid,sku_desc,cat_desc,cls_desc" UseAccessibleHeader="False" AutoGenerateColumns="False" EmptyDataText="No data available qwe123." AllowPaging="True" AllowSorting="True" OnPageIndexChanging="availableItemsGridView_PageIndexChanging" OnSorting="availableItemsGridView_Sorting"> 

When text is beeing changed in availableItemsFilterTextBox, no difference how - does it looses focus or Enter is pressed, postback occurs twice and event TextChanged also fires twice.

Update panel has trigger defined

<asp:AsyncPostBackTrigger ControlID="availableItemsFilterTextBox" EventName="TextChanged" />

In firebug I can see couple of requests. first of them is in "Aborted" state

I have experimented with page itself by setting AutoEventWireup="false" and placing implicit call to "Page_Load" in form tag <form id="form2" runat="server" onload="Page_Load" > . I was thinking that might be the reason for twice postback. But no success...

I tried to so save textbox Text value in ViewState during first postback and then to compare it with value from viewState. But unfortunatly I have figured out that between first and second postback I loose data from viewstate.

I tried to make the same trick using session.

                string vsFilter = (string)Session[AvailableItemsFilterTypes_Text];
            if (vsFilter != filter)
            {
                Session.Add(AvailableItemsFilterTypes_Text, filter);

                this.LoadAvailableItems();
            }

But this only prevent data from loading, since first call back loads data and then becomes aborted without being rendered. And second postback is prevented from calling LoadAvailableItems();

Inside LoadAvailableItems() I am using OracleAdapter and have to call stored procedure with output parameter of OracleDbType.RefCursor And to enable sorting and paging availableItemsGridView I have to get dataview from dataset. And then bind it to availableItemsGridView. As far as I figured out SqlDataSource is not compatible enought to work with Oracle...

 DataView dataview = availableItemsDataSet.Tables[0].DefaultView;
            //dataview is required only to specify sorting
            dataview.Sort = sortExpression + sortDirection;

            availableItemsGridView.DataSource = dataview; 
            availableItemsGridView.PageIndex = NewPageIndex;

            availableItemsGridView.DataBind();

Please, help me to solve this brainteaser. I can't understant why I receiving TextCahnged event twise and how and where first postback request is beeing aborted?

Answer 1

I would recommend using Web Methods and calling them using jQuery. You will see much better performance and avoid the double postback as well.

Here is a good example: http://weblogs.asp.net/craigshoemaker/archive/2008/11/07/using-jquery-to-call-asp-net-ajax-page-methods-by-example.aspx