EXT implementation of the scroll bar is always at the bottom of the method

Source: Internet
Author: User

In our actual development application, often use to ext the commonly used control textarea. For some form form, input information of the notes, introduction and so on when more information will be used textarea. Recently in a full network topology map, as well as network Diagnostics Ping,telnet connectivity testing and so on, there are some more difficult problems. It is through the AJAX request background data, the new data dynamically displayed in the textarea, the textarea scroll bar will not be positioned to the bottom. Always appear in the top position. After the study found that ext to its own TEXTAREA encapsulation, using the table layout. The control object we get from the getcmp () method is actually a table, which we fail to set its scrolltop on the table and get its ScrollHeight property. And what we really need is the textarea itself, not its parent component table.

Here I have my realization method to share to each netizen, make everybody take some detours less.

<pre name= "Code" class= "JavaScript" >xtype: ' Container ',
region: ' Center ', layout
: ' Fit ',
items:[{
	Margin: ' 0 0 ',
	xtype     : ' textarea ',
	grow      : True,
	ID      : ' textarea_id ',
	fieldlabel: ',
	readonly:true,
	autoscroll:true
}

Solution 1:

var textarea=ext.getcmp (' textarea_id ');
Textarea.bodyel.dom.childnodes[0].scrolltop=textarea.bodyel.dom.childnodes[0].scrollheight;
Solution 2:

document.getElementById (' Textarea_id-inputel '). scrolltop = document.getElementById (' Textarea_id-inputel '). ScrollHeight;
After testing, both scenarios can be used.
Welcome everyone to pay attention to my personal blog ....
If you do not understand, doubt or defective place, please add QQ Group: 135430763 for feedback, common learning.

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.