Skip to Content (Press Enter)
UserImage.jpg
Sankareswari Muthiah
1146Views
9Comments
Enabling Scroll Bar in a disabled TextArea or Input Box
Question

Hi,


     I have Textarea and as read only. I noticed scroll bar is also disabled along with it. I want to scroll and read the content. Is there any way to enable the scroll bar in a disabled Text Area. Please let me know


Thanks

Sankari

0
0
02 Oct 2019
Copy Link
2025-10-07 17-18-19
João Branco

Sankareswari Muthiah wrote:

Hi,


     I have Textarea and as read only. I noticed scroll bar is also disabled along with it. I want to scroll and read the content. Is there any way to enable the scroll bar in a disabled Text Area. Please let me know


Thanks

Sankari

Hi,

I think you need to know the readonly property by javasrcript or jQuery.

See next exemple: https://jsfiddle.net/Chouchen/x9RJu/

Joao Branco



0
0
02 Oct 2019
Copy Link
UserImage.jpg
Sankareswari Muthiah

João Branco wrote:

Sankareswari Muthiah wrote:

Hi,


     I have Textarea and as read only. I noticed scroll bar is also disabled along with it. I want to scroll and read the content. Is there any way to enable the scroll bar in a disabled Text Area. Please let me know


Thanks

Sankari

Hi,

I think you need to know the readonly property by javasrcript or jQuery.

See next exemple: https://jsfiddle.net/Chouchen/x9RJu/

Joao Branco




Hi,

     Iam actually using Input box to act as Text Area. I just set the property Enabled false. It disabled including scroll bar also. Iam not sure how to implement your solution in outsystems?. Can you pls guide me more.


0
0
02 Oct 2019
Copy Link
UserImage.jpg
Sankareswari Muthiah

Fixed this by using Expression within a container instead of Input Box. Thanks

1
0
03 Oct 2019
Copy Link
2025-10-07 17-18-19
João Branco

Sankareswari Muthiah wrote:

Fixed this by using Expression within a container instead of Input Box. Thanks


Nice! :)

0
0
04 Oct 2019
Copy Link
2019-05-02 05-10-57
Richard Pearce

Sankareswari Muthiah wrote:

Fixed this by using Expression within a container instead of Input Box. Thanks

Hi Sankareswari,

I also tried placing an expression within a container but it is not scrolling for me.  How did you do it ?

Cheers, Richard

0
0
09 Oct 2019
Copy Link
2024-02-16 07-43-18
Amit Verma

Richard Pearce wrote:

Sankareswari Muthiah wrote:

Fixed this by using Expression within a container instead of Input Box. Thanks

Hi Sankareswari,

I also tried placing an expression within a container but it is not scrolling for me.  How did you do it ?

Cheers, Richard

Hi Richard,

Add class in a container and apply some CSS on the Screen Level.

Please refer below screen shots



CSS Style :

div.ex1 {
  background-color: lightblue;
  width: 450px;
  height: 200px;
  overflow: scroll;
}

https://vermaamit52.outsystemscloud.com/Utilities/ScrollBarScreen.aspx?_ts=637062163151711303

Hope this will help :)

Thanks,

Amit

1
0
09 Oct 2019
Copy Link
2019-05-02 05-10-57
Richard Pearce

Amit Verma wrote:

Richard Pearce wrote:

Sankareswari Muthiah wrote:

Fixed this by using Expression within a container instead of Input Box. Thanks

Hi Sankareswari,

I also tried placing an expression within a container but it is not scrolling for me.  How did you do it ?

Cheers, Richard

Hi Richard,

Add class in a container and apply some CSS on the Screen Level.

Please refer below screen shots



CSS Style :

div.ex1 {
  background-color: lightblue;
  width: 450px;
  height: 200px;
  overflow: scroll;
}

https://vermaamit52.outsystemscloud.com/Utilities/ScrollBarScreen.aspx?_ts=637062163151711303

Hope this will help :)

Thanks,

Amit

Thanks Amit.

The answer for me was to add the 'overflow' property.

Cheers, Richard.


0
0
16 Oct 2019
Copy Link
2026-03-05 14-21-52
José Pinto

Adding a class to the extended properties of the input box with 

.unblockScroll {  
    cursor: default !important;
    pointer-events: all !important;
}

will serve as a workaround to keep using the input box and it's enabled property and avoid screen logic.

10
0
30 Sep 2020
Copy Link
2024-09-12 15-12-50
Munyaradzi Kandoro

You can add an attribute(Outsystems reactive/Mobile) or extended property to the text area. You can look at this article as it highlights the difference between the disabled and the readonly HTML attribute. The ReadOnly attribute as the name suggests makes the element ReadOnly i.e. the element will be enabled (including the scroll bar) but its contents cannot be edited.

3
0
18 Jul 2022
Copy Link
Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.