web-dev-qa-db-fra.com

Conserver la position de défilement du panneau sur la publication partielle ASP.NET

J'ai une grille qui est insérée dans le panneau ASP.NET. le panneau et Gridview sont dans un UpdatePanel. il y a une colonne dans gridview qui provoque des post-back partiels. je veux maintenir la position de défilement du panneau sur ces publications. Y a-t-il un moyen? Cordialement.

asp.netupdatepanelpostbackscroll
20
Shahin

Il n'y a pas de fonction intégrée pour le résoudre dans asp.net

Toutefois, il existe une solution de contournement pour ce problème; Vous devez le gérer avec javascript.

La solution est mentionnée ici: Maintenir la position de la barre de défilement dans UpdatePanel après un postback partiel

Édité le 20 mai 2012; après avoir vu les commentaires

<form id="form1" runat="server">
  <asp:ScriptManager ID="ScriptManager1" runat="server" ScriptMode="Release" />
   <script type="text/javascript">
      // It is important to place this JavaScript code after ScriptManager1
      var xPos, yPos;
      var prm = Sys.WebForms.PageRequestManager.getInstance();

      function BeginRequestHandler(sender, args) {
        if ($get('<%=Panel1.ClientID%>') != null) {
          // Get X and Y positions of scrollbar before the partial postback
          xPos = $get('<%=Panel1.ClientID%>').scrollLeft;
          yPos = $get('<%=Panel1.ClientID%>').scrollTop;
        }
     }

     function EndRequestHandler(sender, args) {
         if ($get('<%=Panel1.ClientID%>') != null) {
           // Set X and Y positions back to the scrollbar
           // after partial postback
           $get('<%=Panel1.ClientID%>').scrollLeft = xPos;
           $get('<%=Panel1.ClientID%>').scrollTop = yPos;
         }
     }

     prm.add_beginRequest(BeginRequestHandler);
     prm.add_endRequest(EndRequestHandler);
 </script>

 <asp:UpdatePanel ID="UpdatePanel1" runat="server">
   <ContentTemplate>
     <asp:Panel ID="Panel1" runat="server" Height="300">
        <%-- Some stuff which would cause a partial postback goes here --%>
     </asp:Panel>
   </ContentTemplate>
 </asp:UpdatePanel>

</form>

Ci-dessous est l'instantané du code: -

Maintain Scrollbar Position Inside UpdatePanel After Partial PostBack

40
Waqas Raja

Ajoutez MaintainScrollPositionOnPostback = "true" à votre directive de page.

5
vml19

Je cherchais une réponse à ce problème depuis plusieurs jours, en utilisant l'alternative typique de MaintainScrollPositionOnPostback et les solutions JavaScript utilisant BeginRequestHandler et EndRequestHandler où dans mon cas j'utilise MasterPage.

Rien n'a fonctionné, mais j'ai trouvé une solution assez simple en utilisant jQuery avec BeginRequestHandler et EndRequestHandler en utilisant le même algorithme @ waqas-raja:

<script type="text/javascript">

    var scrollPosition = 0;

    $(document).ready(function () {

        $(window).scroll(function (event) {
            scrollPosition = $(window).scrollTop();
        });

    });

</script>

<script type="text/javascript">

    // It is important to place this JavaScript code after ScriptManager1
    var xPos, yPos;
    var prm = Sys.WebForms.PageRequestManager.getInstance();

    function BeginRequestHandler(sender, args) {
        console.log('BeginRequest');
    }

    function EndRequestHandler(sender, args) {
        $(window).scrollTop(scrollPosition);
    }

    prm.add_beginRequest(BeginRequestHandler);
    prm.add_endRequest(EndRequestHandler);

</script>

L'idée est de capturer la position du Scroll dans une variable globale à chaque fois que l'utilisateur déplace le Scroll, de cette manière, on sait quelle était la dernière position et lors de la publication, l'événement EndRequestHandler est entré et mis à jour avec la dernière position ce qui l'utilisateur marqué

Cela a fonctionné pour moi dans Firefox et Google Chrome :)

0
Julián