How to change the position of the scroll bar after Ajax updatepanel is returned

Source: Internet
Author: User
The main method is:

Use a hidden control to save the current scorll value. After return, reset Scroll Based on the value of scroll.

1. First, use the onscroll event to save the scorll value and use hiddenfield to record the scroll value.

< Div ID = "Lv_content" Class = "Unify_content" Style = "Padding-left: 0; Height: 455px ;" Onscroll = "Setscrollposition (this )" >
</ Div >
< ASP: hiddenfield ID = "Hiddenfieldscroll" Runat = "Server"   />

Code // 2Write onscroll events, mainly used to save the scroll value of the current control
Function Funsavescroll (sender ){
// Obtain the hidden control.
VaR Vscroll = $ Get ( ' Ctl00_contentplaceholder1_hflvscroll ' );
If (Vscroll ! =   Null ){
// Set the value of the hidden control to scorll.
Vscroll. Value = Sender. scrolltop;
}
}

Code //3. process the scorll value in the page load completion event
VaR PRM = SYS. webforms. pagerequestmanager. getinstance ();
// Set the loading completion event
PRM. add_pageloaded (pageloaded );

// After the widget is loaded, reset the scroll value of the control.
Function Pageloaded (sender, argS ){
// Get the control for setting scroll Value
VaR Vdiv = $ Get ( " Lv_content " );
If (Vdiv ! =   Null ){
// Obtain the hidden control.
VaR Vscrollvalue = $ Get ( " Ctl00_contentplaceholder1_hflvscroll " );
// Set the scroll value of the control.
Vdiv. scrolltop = Vscrollvalue. value;
}
}

Pass the aboveCodeThe problem of scroll changes after the return is solved.

 

If the master page is used, you can put the above Code in the master page for public use.

1) Add hiddenfield to the master page first.

< ASP: hiddenfield ID = "Hiddenfieldscroll" Runat = "Server"   />

Code /*
2) write an onscroll event on the master page to record the scroll value of the control on other pages.
Usage: you only need to set its ID in the control to be set and add the onscroll event. Add the onscroll = "setscrollposition (this)" Statement
*/
Function Setscrollposition (sender ){
VaR Scrolltemp = $ Get ( " Ctl00_hiddenfieldscroll " );
If (Scrolltemp ! =   Null ){
// Save the ID and scroll of the control to be set. Separated by "|"
Scrolltemp. Value = Sender. ID +   " | "   + Sender. scrolltop;
}
}

 

Code //3) process the scorll value in the page loading completion event
SYS. webforms. pagerequestmanager. getinstance (). add_pageloaded (onpageloaded );
// The pageloaded for scroll Orientation
Function Onpageloaded (sender, argS ){
VaR Scrolltemp = $ Get ( " Ctl00_hiddenfieldscroll " );
If (Scrolltemp ! =   Null ){
VaR Scorllvalue = Scrolltemp. value;
If (Scorllvalue. Length >   0 ){
VaR Target = Scorllvalue. Split ( " | " );
If (Target. Length >   1 ){
VaR Targetcontrolid = Target [ 0 ];
VaR Targetvalue = Target [ 1 ];
VaR Targetcontrol = $ Get (targetcontrolid );
// Obtain the control to be set.
If (Targetcontrol =   Null   | Targetvalue. Length <   1 ){
Return ;
}
// Set the scroll value of the control.
Targetcontrol. scrolltop = Targetvalue;
}
}
}
}

 

<% -- 4) When calling, add onscroll to other page controls="Setscrollposition (this)"And set the ID. -- %>
< Div ID = "Lv_content" Class = "Unify_content" Style = "Padding-left: 0; Height: 455px ;" Onscroll = "Setscrollposition (this )" >
</ Div >

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.