Scroll to top of details page - doesn't work with Menu Layout - urgent!

[slimpens]

Hi,

I have form which ads a record. Upon finishing the form, the user is going straight to the details page.
However, when the details page is loaded, it’s starting at the bottom of the page. I want that upon page load of the details page, the user is automatically scrolled to the top.

i added the custom JS to the details page, but that doesn’t work. The details page also contains a Layout (of a Menu), but I don’t know if that has any effect.
Update: when removing the lay-out, it does work! So how can I change this?

Could someone please help me?

[slimpens]

Update:
I rebuild the whole form + details page from scratch. After adding 5 fields I tested it and, everything works… → the details page starts at the top.
However, then rebuilding the whole form (3 multi-step, 8 validation rules, 5 records rules) and testing it again, the issue persists. Users are being forward to the bottom of the details page. And have to scroll up…

[Kristen]

Have you tried wrapping the JavaScript in the details component function:

TB.render(‘component_3’, function(data) {
window.scrollTo(0,0);
});

Most likely, the details component is loading after your JavaScript has run. Don’t forget to change the component number to your component number.

[slimpens]

@Kristen
Do I need to add this in a HTML component in the Details component? My Details page is ‘long’ contains several details components & html fields…
So where do I need to reference too? maybe the most component on the top?

As in this: ??

[SuiteUpstairs]

Hi @slimpens, This code needs to be added to the page’s JavaScript, and it should reference the details component. Do you have more than one details component on the page?

[slimpens]

@SuiteUpstairs ,

yes, I have more than 1 details component on the page. But I added the code, but it still doens’t work. It keeps starting at the bottom of the page.

The JS code refers to the ‘top’ one of the details component…

[christopher93]

@slimpens

In my case, the above solution didn’t work. Instead, I tried the following, which worked for me:

document.querySelector(".tb-main-content").scrollIntoView();