To keep scroll always to the last element of the list in Chat app.

Rank: #13019

Solved

To keep scroll always to the last element of the list in Chat app.

Question

I am trying to develop a chat app. I need a way to keep the scroll of element always to the last element of the list. I have tried Scroll TO widget of outsystems UI and also js in ONRender action,but none of them are working.

on 2020-10-20

Vipasha Sharma

Rank: #648

Solution

Hi Divyesh,

You can use "ScrollToEvent" widget as well to keep the scroll at the bottom of you page.

1. Place a container with height as 0 at the bottom of your screen.

2. Use "ScrollToEvent" widget inside you "OnRender" event, pass the name of container to widget.

Hope this will help you.

Regards,

Vipasha

See solution in context

on 2020-10-20

1 reply

on 2020-10-21

Show thread

Hide thread

Divyesh Halatwala

Rank: #13019

Vipasha Sharma wrote:

Hi Divyesh,

You can use "ScrollToEvent" widget as well to keep the scroll at the bottom of you page.

1. Place a container with height as 0 at the bottom of your screen.

2. Use "ScrollToEvent" widget inside you "OnRender" event, pass the name of container to widget.

Hope this will help you.

Regards,

Vipasha

Thanks Vipasha .

Scroll To Element worked.

on 2020-10-21

Devendra Baghel

Rank: #1974

Hi Divyesh,

Dont use Onrender event better use any event triggered by chat app to scroll it to bottom.

Best Regards

Devendra

on 2020-10-20

1 reply

on 2020-10-21

Show thread

Hide thread

Divyesh Halatwala

Rank: #13019

Devendra Baghel wrote:

Hi Divyesh,

Dont use Onrender event better use any event triggered by chat app to scroll it to bottom.

Best Regards

Devendra

Thanks Devendra for replying. Its a chat application so when the screen is loaded i want all my messages to get loaded and get auto scrolled down to the last message . So I am using on render method. I was using JS scrollintoView in onRender , but it was not useful because I think DOM was not loaded at that time and I was getting error message "Cannot read property 'scrollintoView' of undefined.". When I used same JS in client action which I triggered using button ,it was working but of no use as I needed this thing to run when the page is loaded .

on 2020-10-21