@Viktoria Could you please kindly check with your technical team and ask for their advice, how the code should be adjusted in order to be effective with the modal page. I think this small enhancement could help a lot of users to create a better customer journey. Appreciate your kind assistance as usual 
Just a quick verification: all the blocks (specifically the list block) are rightly updated?
If they are rightly updated, could we check the page? (A link to the live version would be the best)
Hi @twmeric 
As Matthieu mentioned, would you mind sharing the link to the List block page of Published app, so I could review the custom code with the tech team?
Hi @Viktoria & @matthieu_chateau , here it comes with the real link that you can test and play: Update Link
The after closure refresh is performing just like what I want it to be, it refreshes and goes back to the particular position of the page so user don’t need to scroll.
Therefore, what I miss is the closure of the modal page, where there should be two things happen upon pressing it:
- send out data to airtable (as it always does)
- close itself 2 seconds after showing the green wordings which indicates a successful update
I wonder if the highlighted part need to be addressed with some codes.
Hope the above details would help working out the viable code which should enhance user experience a lot - a few lines of code can make a huge difference. Nice weekend!
Does this work with the side-modal? I have put this in my main-page footer. When I close the modal, it doesn’t refresh the page though.
Here’s what I’ve got in my footer of the main page:
Hi @twmeric,
Here the code you need to insert in the page that will be used as a popup and where the form is (so not to be inserted in the parent page)
<script>
document.addEventListener('DOMContentLoaded', () => {
window.addEventListener('submit-form-success-form1', () => {
window.parent.location.reload();
});
});
</script>
Just change form1 by the name of your form
@flavi Just to be sure, you want the page to refresh after clicking on this X button (the close button) or after a form submission? If after a form submission: just do exactly like I wrote above.
If it’s on close modal action (so with the X button), I dont have any solution and I won’t do it (I realize there is no sense to have such action)
1 Like
Hi Matthieu, highly appreciate and I think this code should be well shared with other softr user! Thanks for your great work again, nice weekend!
If this code is inserted in the footer of the sign-in page and the site sign in page is set to open in modal, will this automatically close the sign in modal and return the user to whichever page they were last on after signing in?
1 Like
Yes, it work for me, but u need to manually close the confirm page, if u have.
In order to do this, here is the code:
What does it do? It listens if the form submit is a success or not. If there is a success, It asks the browser to go back 1 page.
Note that I don’t know if the sign in block has the same kind of event listeners as ‘submit-form-success’ but you can give it a try.
<script>
document.addEventListener('DOMContentLoaded', () => {
window.addEventListener('submit-form-success-form1', () => {
window.parent.history.back();
});
});
</script>
If you need to go back two pages 
<script>
document.addEventListener('DOMContentLoaded', () => {
window.addEventListener('submit-form-success-form1', () => {
window.parent.history.go(-2);
});
});
</script>
Update: sign in and sign up event listeners will be added by Softr within the next 2 weeks. I will update the code accordingly
2 Likes
Hello Matthieu,
can I open form from list details into side modal, then after from submission to close the modal and update the parent page automatically? if yes, how to do?
Hi Tawfeeq,
It works exactly the same as: Automatic modal closure after button pressed on it - #20 by matthieu_chateau
With this code you don’t have to worry about the type of modal to close, as all is made by the page reload (and as a page reload always closes any modal => 2 actions in 1)
1 Like
Firstly thank you so much Matthieu for all you work in the forum - unreal!
In relation to
<script>
document.addEventListener('DOMContentLoaded', () => {
window.addEventListener('submit-form-success-form1', () => {
window.parent.location.reload();
});
});
</script>
Instead of form I wanted to use a list which in turn updated a record with Softr’s new action button.
I thought it would be a case of changing ‘submit-form-success-form1’ -but how wrong I was.
Are you able to give any guidance at all?
Many Thanks in advance!
Hi!
Yes I can,
Here are the event listeners given by Artur for the new action buttons= Action Buttons - Update Records event listeners
So the code for you would be
<script>
document.addEventListener('DOMContentLoaded', () => {
window.addEventListener('update-record-success-list1', () => {
window.parent.location.reload();
});
});
</script>
Just change list1 by the name of your list. The code needs to be inserted in the footer code of the page settings where your list is.
PS: I couldn’t see the script you wanted to show me (But I did it for you, don’t worry, now it’s visible). To show scripts in a post, be careful to use this option in the text editor, when writing : </>
Tell me if it worked!
Note also that updating a record with the update action button will update the list automatically without needing this code. But maybe you want something in the parent page to be updated according to the update of the list in the child page? (Hopefully I can be understood 
)
Thank you so much for your speedy reply @matthieu_chateau
It worked like a dream! I am hoping other users will get the same benefits!
Cant thank you enough.
1 Like
One question is there a way we could add a small buffer to the refresh rate like 2 seconds as its refreshing before the Airtable has finished its automatons.
Yes,
Here it is:
<script>
document.addEventListener('DOMContentLoaded', () => {
window.addEventListener('update-record-success-list1', () => {
setTimeout(() => {
window.parent.location.reload();
}, 2000);
});
});
</script>
Or
<script>
document.addEventListener('DOMContentLoaded', () => {
window.addEventListener('update-record-success-list1', () => {
const intervalId = setInterval(() => {
clearInterval(intervalId);
window.parent.location.reload();
}, 2000);
});
});
</script>
You can vary the delay by changing ‘2000’ (milliseconds)
Thank you so much - unfortunately this is now stopping the closure of the box and the refresh of the parent page. Would there be anything in the parent page I would need to add? Thank you once again.
Nothing to do in the parent page.
Maybe you could try 3000?
Or use the second script I gave?
I tried on my end with a similar use case, no problem even with 1500 (the code must be in the page where the modal leads, child page. As you update a list which is in a modal?)
3000 - was the magic number! Honestly that’s wonderful stuff - really grateful for you support. Been banging my head against this today. Super happy!
1 Like