2012-06-13 90 views
0

我有一個網頁上的多個UpdatePanels,其中一個內部UserControl(紫色ColorBox如圖中所示)和其他內部主頁面。當主頁的尋呼用戶控制(< 1 2 3 >)被調用時,它顯示'最新消息'部分對應的UpdateProgress,但也顯示'訂閱'用戶控制的UpdatePanelAnimationExtender多個UpdatePanel回發觸發updateprogress其他UpdatePanel動畫

我使用UpdatePanelAnimationExtender進行用戶控制,UpdateProgress用於主頁上的Latest-New。

我試圖改變屬性,但它一直在來;如果我爲用戶控制保留UpdateMode="Conditional",則進度條進入循環並持續顯示。

屏幕截圖Update Panel

我如何修改這個代碼只顯示相應的進度條。我看了過去幾天的50多個例子,但修女似乎在工作。如果有人能幫助我解決這個問題,我將不勝感激。

<!-- LatestNewArea --> 
    <div class="LatestNewArea"> 
     <asp:UpdatePanel ID="updLatestNews" runat="server" UpdateMode="Conditional"> 
     <ContentTemplate> 
      <asp:Repeater ID="rptLatestNews" runat="server" EnableViewState="False" onitemdatabound="rptLatestNews_ItemDataBound"> 
       <ItemTemplate> 
       <asp:HyperLink ID="hylLatestNews" CssClass="chylLatestNews" runat="server" NavigateUrl=''> 
        <div class="LatestNewsWrapper"> 
         <div class="LatestNewsDateBox"> 
          <div class="LNYYYY"> 
           <asp:Label ID="lblYYYY" runat="server" Text="2012"></asp:Label> 
          </div> 
          <div class="LNDDMM"> 
           <asp:Label ID="lblDDMM" runat="server" Text="12/08"></asp:Label> 
          </div> 
         </div> 
         <div class="LatestNewsTitle"> 
          <asp:Label ID="lblLatestNewsTitle" runat="server" Text="First News for the Website"></asp:Label> 
         </div> 
         <div class="LatestNewsHDate"> 
          <asp:Label ID="Label1" runat="server" Text="Hijri: 15 Rajab 1433"></asp:Label> 
         </div> 
         <div class="LatestNewsDesc"> 
          <asp:Label ID="Label2" runat="server" Text=""></asp:Label> 
         </div> 
        </div> 
        <div class="LNHLine"> </div> 
       </asp:HyperLink> 
      </ItemTemplate> 
     </asp:Repeater> 
     <!-- Pager --> 
     <div class="LatestNewsPagerWrapper"> 
     <div class="LatestNewsPagerInnerWrapper"> 
      <asp:UpdateProgress ID="UpdateProgress1" runat="server" DisplayAfter="50" AssociatedUpdatePanelID="updLatestNews" > 
       <ProgressTemplate> 
       <div id="imgLoadingArticleList" class="imgLoadingArticleList"> 
        <asp:Image ID="imgLoading" runat="server" ImageUrl="~/images/ajax-loader-bar2.gif" /> 
       </div> 
       </ProgressTemplate> 
      </asp:UpdateProgress> 
      <uc1:PagerControl ID="PagerControl1" runat="server" CssClass="gold-pager" PageMode="LinkButton" /> 
     </div> 
     </div> 
     <!-- Pager --> 
    </ContentTemplate> 
    </asp:UpdatePanel> 
    </div> 
    <!-- LatestNewArea --> 

用戶控制網頁代碼

<script type="text/javascript"> 

     function onUpdating() { 
      // get the divImage 
      var panelProg = $get('divImage'); 
      // set it to visible 
      panelProg.style.display = ''; 

      // hide label if visible  
      var lbl = $get('<%= this.pnlSubscribe.ClientID %>'); 
      lbl.innerHTML = ''; 
     } 

     function onUpdated() { 
      // get the divImage 
      var panelProg = $get('divImage'); 
      // set it to invisible 
      panelProg.style.display = 'none'; 
     } 

    </script> 

<table cellpadding="0" cellspacing="0" class="SubscribeContainer"> 
    <tr> 
     <td align="center"> 
      <table cellpadding="0" cellspacing="0" class="SubscribeWrapper" border="0"> 
       <tr> 
        <td valign="top"> 
        <asp:UpdatePanel ID="updSubscribe" runat="server" > 
         <ContentTemplate> 
           <asp:Panel ID="pnlSubscribe" runat="server" Height="10px"> 
            <div class="SubHeading"><asp:Label ID="lblTitle" runat="server" Text="JOIN US"></asp:Label></div> 
            <div class="dSubName"> 
             <asp:TextBox ID="txtName" CssClass="txtSubscribe" runat="server" Text="NAME" onfocus="if(this.value=='NAME')this.value='';" onblur="if(this.value=='')this.value='NAME';"></asp:TextBox> 
            </div> 
            <div class="dSubEmail"> 
             <asp:TextBox ID="txtEmail" CssClass="txtSubscribe" runat="server" Text="YOUR EMAIL" onfocus="if(this.value=='YOUR EMAIL')this.value='';" onblur="if(this.value=='')this.value='YOUR EMAIL';"></asp:TextBox> 
             <asp:RequiredFieldValidator ID="rfvEmailSub" runat="server" ErrorMessage="*" 
              ControlToValidate="txtEmail" ValidationGroup="SubEmail" ></asp:RequiredFieldValidator> 
             <asp:RegularExpressionValidator ID="revEmailSub" runat="server" 
              ErrorMessage="*" ControlToValidate="txtEmail" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" 
              ValidationGroup="SubEmail" ></asp:RegularExpressionValidator> 
            </div> 
            <div class="dSubSubmit"> 
             <asp:Button ID="btnSubscribe" CssClass="btnSubscribe" runat="server" ValidationGroup="SubEmail" Text="Subscribe" onclick="btnSubscribe_Click" /> 
            </div> 
           </asp:Panel> 
            <div class="dSubMSG"> 
            <asp:Label ID="lblMSG" runat="server" Text=""></asp:Label> 
           </div> 
              <div id="divImage" style="display:none" class="dSubAni"> 
               <asp:Image ID="Image1" runat="server" ImageUrl="~/Images/loader-sub.png" Visible="true"/> 
              </div> 

         </ContentTemplate> 
        </asp:UpdatePanel> 

        <asp:UpdatePanelAnimationExtender ID="UpdatePanelAnimationExtender1" TargetControlID="updSubscribe" runat="server"> 
        <Animations> 
         <OnUpdating> 
          <Parallel duration="0"> 
           <ScriptAction Script="onUpdating();" /> 

           <EnableAction AnimationTarget="btnSubscribe" Enabled="false" />      
          </Parallel> 
         </OnUpdating> 
         <OnUpdated> 
          <Parallel duration="0"> 
           <ScriptAction Script="onUpdated();" /> 
           <EnableAction AnimationTarget="btnSubscribe" Enabled="true" /> 
          </Parallel> 
         </OnUpdated> 
        </Animations> 
        </asp:UpdatePanelAnimationExtender> 


         </td> 
        </tr> 
       </table> 
      </td> 
     </tr> 
    </table> 

其他信息:ASP.Net 4.0,C#&尋呼控制是使用LinkBut​​ton的尋呼

回答

0

我試過很多解決方案用戶的控制,但他們中沒有一個以正確的方式工作。最後我決定跟UpdateProgress更換用戶控制的UpdatePanelAnimationExtender,因爲我是能夠捕獲發起的UpdatePanel爲AsyPostback

出於某種原因,我沒能捕獲AsyPostback當我用UpdatePanelAnimationExtender

這種方法可以用於多個更新組中的一種需要來捕獲後背部

BELOW發起控制是工作CODE

// Function to hide control on update 
      function onUpdateOfSubscribe() { 
       var panelProg = $get('divImage'); 
       // set it to visible 
       panelProg.style.display = ''; 
       // hide label if visible  
       var lbl = $get('<%= this.pnlSubscribe.ClientID %>'); 
       lbl.innerHTML = ''; 
      } 
    //Code to track the initiating event so to associate updateprogress 
     var currentPostBackElement; 
     function pageLoad() { 
      var manager = Sys.WebForms.PageRequestManager.getInstance(); 
      manager.add_initializeRequest(OnInitializeRequest); 
     } 
     //On OnInitializeRequest 
     function OnInitializeRequest(sender, args) { 
      var manager = Sys.WebForms.PageRequestManager.getInstance(); 
      currentPostBackElement = args.get_postBackElement().parentElement; 

      var cmdAuthoriseButton = '<%= btnSubscribe.ClientID %>'; 
      if (cmdAuthoriseButton == args._postBackElement.id) { 
       // Show UpdateProgress for subscribe 
       onUpdateOfSubscribe(); 
      } 
     } 
    </script> 

<table cellpadding="0" cellspacing="0" class="SubscribeContainer"> 
     <tr> 
      <td align="center"> 
       <table cellpadding="0" cellspacing="0" class="SubscribeWrapper" border="0" > 
        <tr> 
         <td valign="top"> 
         <asp:UpdatePanel ID="updSubscribe" runat="server" UpdateMode="Conditional" > 
          <ContentTemplate> 
            <asp:Panel ID="pnlSubscribe" runat="server" Height="10px"> 
             <div class="SubHeading"><asp:Label ID="lblTitle" runat="server" Text="JOIN US"></asp:Label></div> 
             <div class="dSubName"> 
              <asp:TextBox ID="txtName" CssClass="txtSubscribe" runat="server" Text="NAME" onfocus="if(this.value=='NAME')this.value='';" onblur="if(this.value=='')this.value='NAME';"></asp:TextBox> 
             </div> 
             <div class="dSubEmail"> 
              <asp:TextBox ID="txtEmail" CssClass="txtSubscribe" runat="server" Text="YOUR EMAIL" onfocus="if(this.value=='YOUR EMAIL')this.value='';" onblur="if(this.value=='')this.value='YOUR EMAIL';"></asp:TextBox> 
              <asp:RequiredFieldValidator ID="rfvEmailSub" runat="server" ErrorMessage="*" 
               ControlToValidate="txtEmail" ValidationGroup="SubEmail" ></asp:RequiredFieldValidator> 
              <asp:RegularExpressionValidator ID="revEmailSub" runat="server" 
               ErrorMessage="*" ControlToValidate="txtEmail" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" 
               ValidationGroup="SubEmail" ></asp:RegularExpressionValidator> 
             </div> 
             <div class="dSubSubmit"> 
              <asp:Button ID="btnSubscribe" CssClass="btnSubscribe" runat="server" ValidationGroup="SubEmail" Text="Subscribe" onclick="btnSubscribe_Click" /> 
             </div> 
            </asp:Panel> 
             <div class="dSubMSG"> 
             <asp:Label ID="lblMSG" runat="server" Text=""></asp:Label> 
            </div> 
               <div id="divImage" style="display:none" class="dSubAni"> 
                <asp:Image ID="Image1" runat="server" ImageUrl="~/Images/loader-sub.png" Visible="true"/> 
               </div> 

          </ContentTemplate> 
          <Triggers> 
           <asp:AsyncPostBackTrigger ControlID="btnSubscribe" EventName="Click" /> 
          </Triggers> 
         </asp:UpdatePanel> 
        <asp:UpdateProgress ID="UpdateProgress1" runat="server" AssociatedUpdatePanelID="updSubscribe" > 
         <ProgressTemplate> 

         </ProgressTemplate> 
        </asp:UpdateProgress> 


          </td> 
         </tr> 
        </table> 
       </td> 
      </tr> 
     </table>