How to Set Textarea Scroll Bar to Bottom as a Default

How do I set textarea scroll bar to bottom as a default?

pretty simple, in vanilla javascript:

var textarea = document.getElementById('textarea_id');
textarea.scrollTop = textarea.scrollHeight;

textarea auto scroll to bottom

You need to change

$('#txt-area').scrollTop($('#txt-area').scrollHeight);    

to

$('#txt-area').scrollTop($('#txt-area')[0].scrollHeight);    

See http://jsfiddle.net/cPYCV/48/

Textarea auto-scroll to the bottom

You need to set scrollTop each time you append text:

var textarea = document.getElementById('textarea_id');
setInterval(function(){
textarea.value += Math.random()+'\n';
textarea.scrollTop = textarea.scrollHeight;
}, 1000);

http://jsfiddle.net/mya0u1zo/2/

How to have a textarea to keep scrolled to the bottom when updated

You can do it by javascript. Set the scrollTop property of text area with scrollHeight property like below:

document.getElementById("textarea").scrollTop = document.getElementById("textarea").scrollHeight 

Autoscroll to bottom of textarea

var textarea = document.getElementById('textarea_id');
textarea.scrollTop = textarea.scrollHeight;

Automatically scroll to the bottom of a text area

Have a look at the updatePolicy property of DefaultCaret: it might do what you want

DefaultCaret caret = (DefaultCaret) textArea.getCaret();
caret.setUpdatePolicy(ALWAYS_UPDATE);

A nice summary of options by Rob (@camickr)



Related Topics



Leave a reply



Submit