# Need html template to write Javascript code to scroll down column to bottom

**URL:** <https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980>\
**Category:** Questions about Thunkable X\
**Created:** [May 11, 2023, 3:51am UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980 "2023-05-11T03:51:24Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![jamjureetree](https://avatars.discourse-cdn.com/v4/letter/j/b3f665/32.png) [@jamjureetree](https://community.thunkable.com/u/jamjureetree)\
**Post date:** [May 11, 2023, 3:51am UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/1 "2023-05-11T03:51:24Z")

</div>

Hi Thunkable staffs,

I am making a chat app and found one problem, the column that I put the chat messages always scroll up to top so it is not convenient for users to see the latest message which is at the bottom.

Thunkable platform currently don’t have block to scroll down column to bottom. I searched in the community for the web viewer or web api and did not find anyone have ever made it. So I will hire a programmer to write the code for me, however he asked me for the html template from Thunkable platform so he can write Javascript from there to scroll down a column to bottom. Could you please give me the html template ?

---

<div class="post-metadata">

**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\
**Post date:** [May 11, 2023, 4:13am UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/2 "2023-05-11T04:13:41Z")

</div>

I could be wrong but I don’t think you can control Thunkable components in that way using JavaScript. You can pass a value from JavaScript but you would have to be able to scroll a column’s contents using Thunkable property blocks after that.

---

<div class="post-metadata">

**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\
**Post date:** [May 11, 2023, 10:48am UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/3 "2023-05-11T10:48:43Z")

</div>

The data viewer blocks _do_ have a scroll to end, don’t they?!

---

<div class="post-metadata">

**Author:** ![domhnallohanlon](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/domhnallohanlon/32/29554_2.png) [@domhnallohanlon](https://community.thunkable.com/u/domhnallohanlon)\
**Post date:** [May 11, 2023, 1:23pm UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/4 "2023-05-11T13:23:45Z")

</div>

![Screenshot 2023-05-11 at 06.22.41](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/0/d/0d077542ddca41542de3cb9ad0c894ce3c5cdf34.png)

Are you thinking of the `Layout` blocks @jared? 😉

---

<div class="post-metadata">

**Author:** ![jared](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/jared/32/138473_2.png) [@jared](https://community.thunkable.com/u/jared)\
**Post date:** [May 11, 2023, 1:49pm UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/5 "2023-05-11T13:49:40Z")

</div>

That’d be it!!! Thank you for clarifying.

@jamjureetree you need to request beta access to this element and you’ll have access to the desired functionality and tool you need to accomplish the task you desire

---

<div class="post-metadata">

**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\
**Post date:** [May 11, 2023, 2:32pm UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/6 "2023-05-11T14:32:39Z")

</div>

Can we have those for Data Viewer Lists? 😀

---

<div class="post-metadata">

**Author:** ![domhnallohanlon](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/domhnallohanlon/32/29554_2.png) [@domhnallohanlon](https://community.thunkable.com/u/domhnallohanlon)\
**Post date:** [May 11, 2023, 2:38pm UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/7 "2023-05-11T14:38:03Z")

</div>

Do you have access to Layouts @tatiang?

I haven’t tried it, but I’d imagine if you put the DVL inside a Layout (or container) that would work 🤞

---

<div class="post-metadata">

**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\
**Post date:** [May 11, 2023, 3:35pm UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/8 "2023-05-11T15:35:26Z")

</div>

Oh interesting, I suppose I could try that. I do have the DVL inside of a container (Layout) so I’ll see if that works. I suspect it won’t but I’ll be happily surprised if it works.

---

<div class="post-metadata">

**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\
**Post date:** [May 11, 2023, 4:52pm UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/9 "2023-05-11T16:52:23Z")

</div>

I set the container to Scroll to End and it didn’t change the display at all if I was viewing the middle of the DVL contents.

---

<div class="post-metadata">

**Author:** ![domhnallohanlon](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/domhnallohanlon/32/29554_2.png) [@domhnallohanlon](https://community.thunkable.com/u/domhnallohanlon)\
**Post date:** [May 11, 2023, 6:11pm UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/10 "2023-05-11T18:11:31Z")

</div>

That’s a shame - was it just a regular data viewer item or are you using a custom layout in there or anything?

---

<div class="post-metadata">

**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\
**Post date:** [May 11, 2023, 6:43pm UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/11 "2023-05-11T18:43:51Z")

</div>

It’s a custom layout.

---

<div class="post-metadata">

**Author:** ![jamjureetree](https://avatars.discourse-cdn.com/v4/letter/j/b3f665/32.png) [@jamjureetree](https://community.thunkable.com/u/jamjureetree)\
**Post date:** [May 12, 2023, 6:52am UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/12 "2023-05-12T06:52:21Z")

</div>

@jared @domhnallohanlon  
Could you please advise me how to request the beta access ?  
Can the Scroll-to-End block be used with a column ?  
Is this beta version applied for D&D or Snap to Place ? I guess it is for D&D.

I decided to use Snap to Place (although I knew that the D&D is the main development of the platform), because it has row and column so it is easy to make the layout. It also has flex and percentage size properties so it is possible to make the responsive screen, will the D&D have these things ? and when ?

---

<div class="post-metadata">

**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\
**Post date:** [May 13, 2023, 5:30am UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/13 "2023-05-13T05:30:18Z")

</div>

I think I know what’s happening. Because I have a layout with a container and a DVL inside the container, the layout is a set length that holds the container which holds the DVL. The DVL has more items than will fit in the container. But… the layout doesn’t change at all based on the contents of the DVL. Neither does the container. So scrolling the layout or container doesn’t affect what is shown. The full layout and full container are already visible. It’s just the DVL (the only contents of the container) that needs to scroll.

So we need a feature that allows the DVL to scroll to end/start using blocks.

---

<div class="post-metadata">

**Author:** ![domhnallohanlon](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/domhnallohanlon/32/29554_2.png) [@domhnallohanlon](https://community.thunkable.com/u/domhnallohanlon)\
**Post date:** [May 17, 2023, 9:07pm UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/14 "2023-05-17T21:07:58Z")

</div>

> [@tatiang](#):
>
> So we need a feature that allows the DVL to scroll to end/start using blocks.

Interesting…can you send me a screenshot of what your DVL looks like (either here or via PM please!) @tatiang ?

Thanks!

---

<div class="post-metadata">

**Author:** ![jamjureetree](https://avatars.discourse-cdn.com/v4/letter/j/b3f665/32.png) [@jamjureetree](https://community.thunkable.com/u/jamjureetree)\
**Post date:** [May 20, 2023, 9:06am UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/15 "2023-05-20T09:06:06Z")

</div>

Could any Thunkable staff please answer my questions below ?  
(I am not sure if this is the way to contact Thunkable staff ?)

Could you please advise me how to request the beta access ?  
Can the Scroll-to-End block be used with a column ?  
Is this beta version applied for D&D or Snap to Place ? I guess it is for D&D.

I decided to use Snap to Place (although I knew that the D&D is the main development of the platform), because it has row and column so it is easy to make the layout. It also has flex and percentage size properties so it is possible to make the responsive screen, will the D&D have these things ? and when ?

---

<div class="post-metadata">

**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\
**Post date:** [May 20, 2023, 3:50pm UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/16 "2023-05-20T15:50:07Z")

</div>

Link to private project: [Thunkable](https://x.thunkable.com/projects/6398b975af710f021a02c651/232e79b9-ea2f-4f69-ac53-f8e23b9ab8d2/designer)

Preview:

 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/f/4/f4278698bafaee86636343f392569befa99ddc22.png)

Component tree:

 ![image](https://us1.discourse-cdn.com/flex015/uploads/thunkable/original/3X/4/3/434139eb02a64a1711ab5037209bc775caab5783.png)

---

<div class="post-metadata">

**Author:** ![Hayder](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/hayder/32/153829_2.png) [@Hayder](https://community.thunkable.com/u/Hayder)\
**Post date:** [May 22, 2023, 10:00pm UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/17 "2023-05-22T22:00:10Z")

</div>

> [@tatiang](#):
>
> So we need a feature that allows the DVL to scroll to end/start using blocks.

It should be set in design section as well because we don’t want users to see DLV or Column scrolling while initializing.

I hope we can see this request in the next release.

---

<div class="post-metadata">

**Author:** ![domhnallohanlon](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/domhnallohanlon/32/29554_2.png) [@domhnallohanlon](https://community.thunkable.com/u/domhnallohanlon)\
**Post date:** [May 23, 2023, 4:58pm UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/18 "2023-05-23T16:58:31Z")

</div>

> [@tatiang](#):
>
> Link

Thanks for sharing @tatiang - do you _have_ to use the DVL here? I think you can achieve all the functionality you want using the clone blocks. Would that be an option?

* * *

> [@jamjureetree](#):
>
> will the D&D have these things ? and when ?

@jamjureetree - these properties and components are available through the Layout component. Is that what you wanted beta access to? I believe the Layout component will be generally available by tomorrow or Thursday, so your timing is perfect.

* * *

> [@Hayder](#):
>
> It should be set in design section as well because we don’t want users to see DLV or Column scrolling while initializing.

Do you mean that it should automatically scroll to the bottom when the screen loads @Hayder?

---

<div class="post-metadata">

**Author:** ![tatiang](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/tatiang/32/55482_2.png) [@tatiang](https://community.thunkable.com/u/tatiang)\
**Post date:** [May 23, 2023, 6:47pm UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/19 "2023-05-23T18:47:25Z")

</div>

> [@domhnallohanlon](#):
>
> Thanks for sharing @tatiang - do you _have_ to use the DVL here? I think you can achieve all the functionality you want using the clone blocks. Would that be an option?

No, I don’t have to. I just assumed that a DVL would be faster to render than cloned blocks, especially as the length gets longer. This is for a ChatGPT app so the user could potentially have dozens of DVL items as the conversation lengthens.

I might try cloning. I really like the ease of use of DVLs.

---

<div class="post-metadata">

**Author:** ![Hayder](https://sea1.discourse-cdn.com/flex015/user_avatar/community.thunkable.com/hayder/32/153829_2.png) [@Hayder](https://community.thunkable.com/u/Hayder)\
**Post date:** [May 24, 2023, 6:15am UTC](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980/20 "2023-05-24T06:15:54Z")

</div>

> [@domhnallohanlon](#):
>
> Do you mean that it should automatically scroll to the bottom when the screen loads @Hayder?

I mean we should have two options:  
In design section:  
If I set the column or DLV to start from end, then no need to show scrolling when the screen opens. It starts from the end normally.  
In block section:  
If I set it in block, then users can see it scrolling.  
Also we need an option to hide loading icon. So it loads without showing the icon.

[Next page](https://community.thunkable.com/t/need-html-template-to-write-javascript-code-to-scroll-down-column-to-bottom/2412980.md?page=2)
