How to set a div scroll to top (after) page load (java and vb code behind)?

saljas
saljas used Ask the Experts™
on
How to set a div scroll to top (after) page load using both java and vb code behind?
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Most Valuable Expert 2017
Distinguished Expert 2018
Commented:
You can't do this with code behind - this is a browser operation. Code behind does not have sight of the browser.

You would need to do this with JavaScript.

Please explain exactly what it is you are wanting to do.

Author

Commented:
I have Two command buttons
Command1 (for new search)
Command2 (for show image)

What I am trying to do is:-
If post is from a (new search command1) then show Div from top
If post is from a (Shaw image command2) then maintain Div scroll position

Below is my JavaScript to maintain Div scroll position, it is working fine.
I need to add to it (if) and a way to know which command is clicked

I have two plans to do it:-
1- To add to it an (if) to check if it is a new search command1 then (do not execute JavaScript, ignore Javascript), because Div usually displayed from top.
2- or To add a line to show Div from top if (ignoring does not work).

I hope this is not too long explanation

<script type="text/javascript">
    window.onload = function () {
         var AnsDiv = document.getElementById("AnsDivScroll");
         var AnsDivPosition = document.getElementById("AnsDivPosition");
         var Ansposition = parseInt('<%=Request.Form("AnsDivPosition") %>');
         if (isNaN(Ansposition)) {       Ansposition = 0;        }
         AnsDiv.scrollTop = Ansposition;
         AnsDiv.onscroll = function () {    AnsDivPosition.value = AnsDiv.scrollTop;    };
    };
</script>
Most Valuable Expert 2017
Distinguished Expert 2018

Commented:
Explain to me what happens when you click the command buttons.

Does your page post back to the server or do you retrieve the result using AJAX.
Ensure you’re charging the right price for your IT

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden using our free interactive tool and use it to determine the right price for your IT services. Start calculating Now!

Author

Commented:
Post back
there is no ajax
Most Valuable Expert 2017
Distinguished Expert 2018

Commented:
So on page render you are wanting to have the page scroll (or not) to the correct location based on the button selected.

There are a couple of options you can try
1. If Command2 is pressed then include some JavaScript on the page that does the scroll

2. Include JavaScript on the page irrespective of the button clicked and if Command2 is clicked put some variable / class on the page to indicate that Command2 was clicked. When the page loads the JavaScript looks for that condition and if it finds it it scrolls.

Which part are you needing help with? How to decide when to scroll or the JavaScript code to do the scroll?
Commented:
the solution is to hold the scroll value in a text box e.g. ('Txt_DivScroll') and use it on loading the page <body> tag as follows:-


<body onload="document.getElementById('div_scroll').scrollTop =  document.getElementById('Txt_DivScroll').value;">

<script language="javascript">
    // function saves scroll position
    function fScroll(val)
    {
        var Txt_DivScroll = document.getElementById('Txt_DivScroll');
        Txt_DivScroll.value = val.scrollTop;
    }
</script>
.....
.....
<div  id="div_scroll" style="background: none repeat scroll 0% 0%; overflow-y: scroll; width:1000px; height:300px; overflow:Auto; padding:1px;" onscroll="fScroll(this);">
.....
.....
</div>

Author

Commented:
thank you Mr. Julian Hansen

Author

Commented:
I have tested it and it is working fine

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial