How to change the position of the scroll bar after Ajax updatepanel is returned by Asp.net

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.CopyCodeThe Code is as follows: <Div id = "lv_content" class = "unify_content" style = "padding-left: 0; Height: 455px;" onscroll = "setscrollposition (this)">
</Div>
<Asp: hiddenfield id = "hiddenfieldscroll" runat = "server"/>

Code
// 2. Write an onscroll event to save the scroll value of the current control.Copy codeThe Code is as follows: 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;
}
}

CodeCopy codeThe Code is as follows: // 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 );

// Reset the scroll value of the control after loading.
Function pageloaded (sender, argS ){
// Obtain the control for setting the 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;
}
}

The above code solves the problem of scroll changes after the return.

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 copy Code the code is as follows: /*
2) Compile an onscroll event on the master page and 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) {
// the ID of the control to be set and the scroll value are saved together. "|" Separated
scrolltemp. value = sender. ID + "|" + sender. scrolltop;
}< BR >}

Code copy Code the code is as follows: // 3) process the scorll value in the page load completion event
sys. webforms. pagerequestmanager. getinstance (). add_pageloaded (onpageloaded);
// The pageloaded for scroll orientation
function onpageloaded (sender, argS) {
var scrolltemp = $ get ("events ");
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;
}< br> // set the scroll value of the Control
targetcontrol. scrolltop = targetvalue;
}< BR >}

4) when calling, add onscroll = "setscrollposition (this) to other page controls) "and set the ID.


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.