ExtJS, can't scroll my textarea to its bottom

Question

I'm using extjs 4 and I've a textarea in which a insert some text, the scroll bar is by default set on top so when the text exceeds the textarea height it overflows. I would like to have my textarea scrollbar set by default on its bottom, so when i insert new text it is immediately shown, without manually scrolling down the scroll bar.

The textarea code is something like this:

items: [{
    xtype: 'textareafield',
    id: 'textarea1',
    autoScroll: true,
    resizable: true,
    name: 'textarea1',
    autorender: true,
    fieldLabel: 'textarea1',
    value: '...'
    },{

I insert new text with

area.setValue(Ext.getCmp('textarea1').getValue()+'\n'+message);

but i can't find any way to autoscroll it down. I've searched both the documentation and google, nowdays almost everyone uses gwt but i can't. Is there a way to achieve the same goal using extjs methods only? In gwt they use methods like .setScrollTop() but there is nothing like it in extjs, of it is i can't find it..

Many thanks for any help you can provide!

See [this question](http://stackoverflow.com/a/10968483/811785) — Saeed Neamati, Jan 02 '13 at 11:49

U and me · Accepted Answer · 2012-05-14T11:13:53.347

0

You can save the old string length of the area text then use selectText() to make the cursor go to the right place.

area.selectText(oldStringLength, oldStringLength);

selectText(start, end) is not actually aimed at this purpose but still can be used though.

edited May 14 '12 at 11:13

answered May 14 '12 at 11:06

U and me

730
5
13

Errata corige, it's not working..well, not everywhere: it works just fine with firefox, same page loaded with chromium (ubuntu's google chrome) don't, the scrollbar is stuck at the top and you have to manually move it. Any idea on why this happens? I've always thought that extjs handled by himself the cross browser compatibility.. – powder May 14 '12 at 16:15
Just found something in case of Chrome. You can try [this solution](http://stackoverflow.com/questions/7464282/javascript-scroll-to-selection-after-using-textarea-setselectionrange-in-chrome) – U and me May 14 '12 at 17:08
@powder what the meaning of 'Errata corige' – Jom May 15 '12 at 13:31

score 0 · Answer 2 · answered Feb 08 '16 at 11:27

0

var d = area.getEl().down('textarea').dom; 
d.scrollTop = d.scrollHeight - d.offsetHeight;

answered Feb 08 '16 at 11:27

Arsen

9
1

ExtJS, can't scroll my textarea to its bottom

2 Answers2