Skip to Content
Author's profile photo Yaron Ganor

Text Area resize handler thingy

Hi again,

The following one is from the tips and tricks department (also posted on the UI5 dev comunity).

This is something I came across trying to solve a weird issue in a text area control we added somewhere in the portal and I thought it might be fun to share.

Sometimes you want to have a text area that can be re-sized by the user for whatever reason.

When you create a new textArea control, it comes with a fixed size that you can set in advance or by css etc.

However, you can very easily make it to be a dynamically re-sizable control if you get to know the following css class:


Here is an example taken straight from the TextArea control’s page on the SAPUI5 Demo Kit website.

I took the TextArea example and modified it in the same page.

When you initially create it, it will come with this class: ‘sapUiTxtA’ and look like this:


So what you can do, is just use removeStyleClass(‘sapUiTxtA’) to get this:


I don’t know why, but sometimes you may have to explicitly add the class in order to actually be able to remove it…

(in this example I did it manually in the console)

I put a better example on snipix for you to play with and copy.

For some reason there is no API for this cute little feature and it does not show up anywhere in the documentation (at least not that I found…).

It’s a cool thing to know and may come in useful to some.

Keep in mind though, that playing around with the styles in such a way, or changing the way a control behaves not thru the API, may prove forward incompatible, so do it at your own risk, or at least keep good references of the places you have made such manipulations.

Have fun.


Assigned Tags

      Be the first to leave a comment
      You must be Logged on to comment or reply to a post.