"Smooth Scroll" from a referrer page. What is the Selector code for that?

… what if I want to smooth scroll from anchor from another page to a page with dynamic data?
So passing the id back to the list page via a #ancor id… and then the page must scroll to that id’s location

I have a listing page with say 500 records on the page where i have a click to edit button.
page-with-ids.php

This takes me to a edit form.
edit.php?id=3753

after the edit the form they will go back to the list page via.
page-with-ids.php?pos=3753#3753 with the id and #anchor

4

Here you will now see the ID is now #4150 but how do i get it to go there…

But it does not go back to the position on the page when the page loads… Only once the page is loaded and i then press enter in the url bar… then it takes me to that position. I have also added a button to the top of the page to say “Continue to load” … and when you click on it it works.

I guess it could be a setting on the Selector? rather from a URL than a HREF???
I could not find anything in die documentation about smooth scroll… can anyone maybe help?
As im passing the #id back via a url and not a href on the page itself.

I have even tried on the body tag
dmx-on:ready=“scroll1.goto(’#’+query.pos)”>

So all i want to do it… scroll to ID 4144 on the page… when directed from another page…

I have tried dmx-on:ready dmx-on:load …

and yes i have edited the # to be now #name(then the number id) all work on the page like a charm with a button. dmx-on:click event… but i want to do it once the page is loaded to go back to that id/place on the page

anyway i have sorted this with php for now… @Emiel

from the referrer page… URL pos…
<?php $posidphp = isset($_GET['pos']) ? $_GET['pos'] : ''; ?>

Then on the page i have a button. Without dmx-bind. With a id id=“triggerbuttongoto”
<a class="btn" href="#gotoid<?php echo $posidphp; ?>" id="triggerbuttongoto" title="Continue to load"> Continue to load </a>

Then at the bottom of the page i run the script. Forcing a on-click event.

$(document).ready(function() {
	setTimeout(function(){
    document.getElementById("triggerbuttongoto").click();
	},3000);
});

that worked for me… :slight_smile:

What if your data does not load in 3 seconds then? It won’t scroll as the element won’t be created yet.
Also what if the data is rendered in 0.5 seconds, then you wait every time until 3 seconds pass to scroll?

What you need here is a repeat children region (not plain repeat) and use the onupdated event to scroll to your id coming from the query parameter.

No need of PHP code and timeout hacks.

2 Likes

@Teodor thank you… for this solution :wink: :wink: sorry i could not find another way… but once again thanks for the great support.