2012-06-13 5 views
0

J'ai plusieurs UpdatePanels sur une page Web, une à l'intérieur de UserControl (Purple ColorBox comme le montre l'image) et d'autres à l'intérieur de la page principale. Lorsque le contrôle de l'utilisateur de pagination (< 1 2 3 >) de la page principale est invoqué, il affiche la section UpdateProgress correspondante de la section "Dernières actualités", ainsi que le UpdatePanelAnimationExtender du contrôle utilisateur "Souscrire".Multipiste UpdatePanel déclencheur updateprogress animation d'autres UpdatePanel

J'utilise UpdatePanelAnimationExtender pour le contrôle de l'utilisateur et UpdateProgress pour la plus récente qui se trouve sur la page principale.

J'ai essayé de changer les propriétés mais ça continue à arriver; si je garde UpdateMode="Conditional" pour le contrôle de l'utilisateur, alors la barre de progression passe en boucle et s'affiche en continu.

Screen ShotUpdate Panel

Comment puis-je apporter des modifications à ce code pour afficher uniquement la barre de progression correspondant. J'ai regardé plus de 50 exemples des derniers jours, mais la nonne semble fonctionner. J'apprécierais que quelqu'un puisse m'aider à résoudre ce problème.

<!-- 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 --> 

User Control Code page

<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> 

Autres informations: ASP.Net 4.0, C# & contrôle de radiomessagerie est un contrôle utilisateur qui utilise linkbutton pour la pagination

Répondre

0

J'ai essayé beaucoup solution, mais aucun d'eux ne travaillait correctement. Enfin j'ai décidé de remplacer UpdatePanelAnimationExtender de contrôle utilisateur avec UpdateProgress que j'ai pu piéger le lancement UpdatePanel pour AsyPostback

Pour une raison que je n'étais pas capable de piéger AsyPostback quand je UpdatePanelAnimationExtender

Cette approche peut être utilisée pour multiple mise à jour panneau un besoin pour piéger le contrôle amorçant la post-retour

CI-DESSOUS EST uN CODE dE TRAVAIL

// 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> 
Questions connexes