AJAX UpdateProgress not working when trigger control is outside of UpdatePanel

Posted on 2009-04-29
Last Modified: 2012-05-06
I basically have the senario outlined at the bottom of this article:

I have an UpdatePanel with triggers monitoring a DropDownList elsewhere in the page.  Apparently such a configuration causes the UpdateProgress not to work.  Is there a better option than the manual javascript suggested in the above article?  Below is a snip of code:
<asp:DropDownList ID="ShippingCountryDropDown" AutoPostBack="true" CssClass="InputDropDown" runat="server" onselectedindexchanged="CountryDropDown_SelectedIndexChanged">


				<asp:UpdatePanel ID="ShippingOptionsUpdatePanel" UpdateMode="Conditional" runat="server">


						<asp:AsyncPostBackTrigger ControlID="ShippingCountryDropDown" />

						<asp:AsyncPostBackTrigger ControlID="CountryDropDown" />




						<asp:Label ID="ShippingMethodLabel" CssClass="FieldLabel" runat="server">Shipping Method</asp:Label>

						<asp:RequiredFieldValidator ID="ShippingMethodValidator" runat="server" ControlToValidate="ShippingMethodDropDown"

							CssClass="ValidationIndicator" ErrorMessage="Please select a Shipping method" ValidationGroup="OrderGroup">*</asp:RequiredFieldValidator>

						<br />

						<asp:DropDownList ID="ShippingMethodDropDown" CssClass="InputDropDown" runat="server">

							<asp:ListItem Value="" Selected="true">Select a shipping method...</asp:ListItem>




		    <asp:UpdateProgress ID="UpdateProgress2" runat="server" AssociatedUpdatePanelID="ShippingOptionsUpdatePanel">


				    <img id="Img2" src="~/Images/ajax_update.gif" alt="Updating..." runat="server"/>



Open in new window

Question by:b_levitt
    LVL 14

    Expert Comment


    Try this.
                                                    <asp:AsyncPostBackTrigger ControlID="ShippingCountryDropDown"  EventName="SelectedIndexChanged"/>
                                                    <asp:AsyncPostBackTrigger ControlID="CountryDropDown" EventName="SelectedIndexChanged />

    Open in new window

    LVL 18

    Assisted Solution

    personaly, i use this one.(sample 3), you dont have to use a AssociatedUpdatePanelID
    LVL 11

    Accepted Solution

    Specifying the event name didn't work.  

    Modals are a little overkill for what I'm doing here but I appreciate the link.  In the end I found a little more info on the example in the bottom of the article I posted:
    I needed this to understand the "$get" shortcut functions exposed by the " Client Side Library"

    In the end my code ended up being:

    <script language="javascript" type="text/javascript">
        var prm = Sys.WebForms.PageRequestManager.getInstance();
        function CancelAsyncPostBack() {
          if (prm.get_isInAsyncPostBack()) {
        var postBackElement;
        function InitializeRequest(sender, args) {
          if (prm.get_isInAsyncPostBack()) {
          postBackElement = args.get_postBackElement();
          if ( == '<%=CountryDropDown.ClientID %>') {
            $get('<%=ShippingOptionsUpdateProgress.ClientID %>').style.display = 'block';
            $get('<%=ShippingOptionsUpdatePanel.ClientID %>').style.display = 'none';
        function EndRequest(sender, args) {
          if ( == '<%=CountryDropDown.ClientID %>') {
            $get('<%=ShippingOptionsUpdateProgress.ClientID %>').style.display = 'none';
            $get('<%=ShippingOptionsUpdatePanel.ClientID %>').style.display = 'block';
    // -->

    Open in new window

    LVL 5

    Expert Comment

    The easy solution to this one... looks like you were missing the AutoPostBack=True on the dropdownlist.
    LVL 11

    Author Comment

    No it's on there - see the code block in my first post...
    <asp:DropDownList ID="ShippingCountryDropDown" AutoPostBack="true"
    LVL 5

    Expert Comment

    My apologies, I was looking at the wrong dropdownlist... ShippingMethodDropDown

    I was having trouble very similar to yours and it turned out that i was just missing the postback...


    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    How your wiki can always stay up-to-date

    Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
    - Increase transparency
    - Onboard new hires faster
    - Access from mobile/offline

    jQuery is a JavaScript library that greatly simplifies JavaScript programming. AJAX is an acronym formed from "Asynchronous JavaScript and XML."  AJAX refers to any communication between client and server, when the human client does not observe a…
    It was really hard time for me to get the understanding of Delegates in C#. I went through many websites and articles but I found them very clumsy. After going through those sites, I noted down the points in a easy way so here I am sharing that unde…
    In this sixth video of the Xpdf series, we discuss and demonstrate the PDFtoPNG utility, which converts a multi-page PDF file to separate color, grayscale, or monochrome PNG files, creating one PNG file for each page in the PDF. It does this via a c…
    Sending a Secure fax is easy with eFax Corporate ( First, Just open a new email message.  In the To field, type your recipient's fax number You can even send a secure international fax — just include t…

    761 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    11 Experts available now in Live!

    Get 1:1 Help Now