When you add Termly’s DSAR form to your website, users fill it out inside an iframe. After they press Submit, the confirmation message shows at the top of the iframe. If the form is long, users may still be at the bottom of the page and not see the message right away.
Here’s a quick way to fix this so the page scrolls up automatically and the message is visible.
How to Fix It
Add a simple JavaScript snippet to your site that scrolls the page back to the top of the iframe whenever it reloads after submission.
<iframe id="dsarForm" src="https://app.termly.io/dsar/UUID"></iframe>
<script>
const iframe = document.getElementById('dsarForm');
iframe.addEventListener('load', () => {
// Scroll the parent page to the top of the iframe
iframe.scrollIntoView({ behavior: 'smooth', block: 'start' });
});
</script>
How It Works
- Submit button pressed: The iframe reloads to display the confirmation message.
- Load event triggered: The script detects the reload.
-
Scroll action: The parent page scrolls smoothly to the top of the iframe, ensuring the message is visible.
Current Limitations
- The DSAR iframe demo does not include a
postWindow()message or built-in event hooks to notify the parent page of content changes. -
This means you cannot directly intercept the form’s state changes from the iframe.
Notes
- This solution works reliably in the current DSAR demo setup, where the iframe reloads after submission.
- If your implementation uses dynamic content injection (without a full reload), the
loadevent may not fire. In that case, a more advanced approach (such asMutationObserveror future support forpostMessage) may be required.
Next Steps
We’re continuing to explore more robust solutions that don’t rely solely on iframe reloads. In the meantime, please test the snippet above in your environment.
Related Articles
How do I set up a DSAR form for my website visitors?
How do I embed a Do Not Sell My Info Button on a Wix website?