Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations SkipVought on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

NEED HELP PLEASE: textarea scrolling

Status
Not open for further replies.

sumsumin

Programmer
Jun 13, 2007
7
0
0
CA
Hey, I'm working on a web application, and it requires that a textarea automatically scroll to the bottom when the page opens. Is there any way to do this?
 
Sure - you can do this using javascript!

Start off by targeting your textarea in a function that runs when the page has loaded (attach to the onload event). The function can use scrollTo() to scroll the textarea (you can use scrollTo() with any object that has a scroll bar). Your function would start a setTimeout() to increase the amount to scroll down each iteration (leaving the scroll across fixed)... and ending when it has reached the bottom of the textarea.

I think I've mentioned all the specifics you'll need to do this.

Let us know if you get stuck on any specifics - and I'm sure we can lend a hand.

Cheers,
Jeff


[tt]Jeff's Page [!]@[/!] Code Couch
[/tt]

Make sure your web page and css validates properly against the doctype you have chosen - before you attempt to debug a problem!

FAQ216-6094
 
Wow, thanks. I'm gonna go try that right now!
 
Well, this is what I put:

...
<script type='text/javascript'>
var lockit=setInterval("document.myform.mytext.scrollTo(0,70)",10)
</script>
</head>
<body onLoad="clearInterval(lockit)">
...

It doesn't work, but I think I know why. When the page loads, and every second after, I have a timer set to use ajax to refresh the content of the textarea, but not the rest of the page. Because of this, I can't use the body onload method, since immediately once the page is loaded it loads the new content into the textarea and seems to automatically scroll back to the top. Is there any way to do this automatic scrolling without using the onLoad method? (I tried just putting clearInterval(lockit) inside my ajax function, but that didn't work either)
 
This will nicely allow you to have multiple onloads (use this technique for all your onload events - and don't use onload="..." inside the body tag):
Code:
<script type="text/javascript">
function initScrolling() {
	var myNode = document.myform.mytext;
	if (myNode) {
		myNode.scrollTo(0,70);
	}
}

if (window.addEventListener) {
	window.addEventListener('load', initScrolling, false);
} else if (window.attachEvent) {
	window.attachEvent('onload', initScrolling);
}
</script>
You could modify the callback for the data that gets placed in the textarea and have it run the scrollTo() function.

Cheers,
Jeff


[tt]Jeff's Page [!]@[/!] Code Couch
[/tt]

Make sure your web page and css validates properly against the doctype you have chosen - before you attempt to debug a problem!

FAQ216-6094
 
I can't get it to work!

I tried it in both firefox and IE. Both didn't work. However, when I tried it in IE, every time the timer refreshed, the bar seemed to flicker down and immediately back up again.

Firefox showed no effect.

Remember the timer resets every second.

I have no idea what to do!
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top