# Scroll to anchor on button onActionPerformed **URL:** \ **Category:** Ignition\ **Tags:** ignition81, perspective, ignition80\ **Created:** [May 4, 2021, 6:20pm UTC](https://forum.inductiveautomation.com/t/scroll-to-anchor-on-button-onactionperformed/46333 "2021-05-04T18:20:08Z")\ **Posts on this page:** 8\ **Page:** 1
**Author:** ![YF129701](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/yf129701/32/60498_2.png) [@YF129701](https://forum.inductiveautomation.com/u/YF129701)\ **Post date:** [May 4, 2021, 6:20pm UTC](https://forum.inductiveautomation.com/t/scroll-to-anchor-on-button-onactionperformed/46333/1 "2021-05-04T18:20:08Z")
I'm trying to scroll to a specific section on the view to improve user experience on long pages. This would be especially useful on smaller devices, which normally have content laid out vertically instead of horizontally. ## Here is what I have done: - created a sample long scrollable view (added a few components, set basis to 1000px, set shrink to false) - added a label on the very bottom of the view - added meta property `domId` with a value of `labelBottom` to said label - added a button at the top of the view - added onActionPerformed script with body ```python system.perspective.navigate('#labelBottom') ``` I'm not sure if `system.perspective.navigate()` is the correct function to use here. I see that it appends `#labelBottom` to the URL. However, nothing happens unless I refresh the page. ## Workaround What I can do is use a Perspective Link component and link to `#labelBottom`, in which case it works as expected. However, I'd like to have the flexibility of using a button for that purpose. #### PS Also another question: when did `domId` become available? My coworker and I were trying to do something similar a few months ago and we didn't see it. I just happened to stumble upon it a few days ago messing around in the designer. Thanks in advance. ---
**Author:** ![cmallonee](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/cmallonee/32/6416_2.png) [@cmallonee](https://forum.inductiveautomation.com/u/cmallonee)\ **Post date:** [May 4, 2021, 7:04pm UTC](https://forum.inductiveautomation.com/t/scroll-to-anchor-on-button-onactionperformed/46333/2 "2021-05-04T19:04:53Z")
> [@YF129701](#): > > when did `domId` become available? It's been "available" since 8.0.0, but we didn't expect customers to make much use of it (outside of this exact scenario). The primary benefit in the product is for us in the QA department so that we can easily identify components during our automated testing. > [@YF129701](#): > > I’m not sure if `system.perspective.navigate()` is the correct function to use here. I see that it appends `#labelBottom` to the URL. However, nothing happens unless I refresh the page. try this: ```auto system.perspective.navigate(url='#labelBottom') ``` This works for me because it's using the browser's navigation "system" instead of using the Gateway to navigate. Note that this will only work while you're already on the page with the `id` present within the element. ---
**Author:** ![YF129701](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/yf129701/32/60498_2.png) [@YF129701](https://forum.inductiveautomation.com/u/YF129701)\ **Post date:** [May 4, 2021, 7:15pm UTC](https://forum.inductiveautomation.com/t/scroll-to-anchor-on-button-onactionperformed/46333/3 "2021-05-04T19:15:29Z")
That is exactly what I was looking for. Thanks @cmallonee ---
**Author:** ![ReyC](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/reyc/32/49461_2.png) [@ReyC](https://forum.inductiveautomation.com/u/ReyC)\ **Post date:** [August 10, 2023, 7:40am UTC](https://forum.inductiveautomation.com/t/scroll-to-anchor-on-button-onactionperformed/46333/4 "2023-08-10T07:40:52Z")
How did you define your #labelbottom ? Is is a label component or it could be the meta name every comonent? ---
**Author:** ![YF129701](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/yf129701/32/60498_2.png) [@YF129701](https://forum.inductiveautomation.com/u/YF129701)\ **Post date:** [August 10, 2023, 2:07pm UTC](https://forum.inductiveautomation.com/t/scroll-to-anchor-on-button-onactionperformed/46333/5 "2023-08-10T14:07:28Z")
You put `#labelbottom` into the `meta.domId` property, if I remember correctly. ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/b/0bcb66cc29d8f7cbcca9b99070a83c29302754f2.png) ---
**Author:** ![rickard.eriksson](https://avatars.discourse-cdn.com/v4/letter/r/7cd45c/32.png) [@rickard.eriksson](https://forum.inductiveautomation.com/u/rickard.eriksson)\ **Post date:** [April 23, 2025, 1:37am UTC](https://forum.inductiveautomation.com/t/scroll-to-anchor-on-button-onactionperformed/46333/6 "2025-04-23T01:37:36Z")
Hi! Is it possible to scroll down 'smoothly' instead of just jumping to the anchor point? ---
**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\ **Post date:** [April 23, 2025, 4:11am UTC](https://forum.inductiveautomation.com/t/scroll-to-anchor-on-button-onactionperformed/46333/7 "2025-04-23T04:11:11Z")
You would need to use js scrollIntoView with the smooth option > [@Perspective table cell question](https://forum.inductiveautomation.com/t/perspective-table-cell-question/78112/3): > > here i did something similar to use js injection to click a row you can add in the column too to select the right column (gotta click it twice too for edits) something like this in the markdown binding code = """\ **Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\ **Post date:** [April 23, 2025, 11:32pm UTC](https://forum.inductiveautomation.com/t/scroll-to-anchor-on-button-onactionperformed/46333/8 "2025-04-23T23:32:15Z") I needed to do this for my application so I chucked it into a View template to use for either tables or flex repeaters. It has all of the options from the scrollIntoView function configurable: ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/b/1/b1cdf0b68bbdf8173f10542d568e80c88b24be4f.png) [JS Hacks - Scroll Row Into View v1.0.zip](https://forum.inductiveautomation.com/uploads/short-url/2sqw5thGUsAnql9xL6SyKW8BW9M.zip) (30.4 KB)