Automatic modal closure after button pressed on it

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

Hi. Will this work with the new delete action as well?

I don’t remember if the delete event listeners are added but you can try ‘delete-record-success-listX’. If not working, wait a week or so and it should be added by then

@matthieu_chateau do you know if we have the delete record event already? I tried but it is not firing…

Hi Pedro,

I think that for delete record the event listener is still submit-form-success-listX

1 Like

Thanks for answering! Now it worked with 'delete-record-success-listx'

2 Likes

The delay reload isn’t working for the add record action though. Any ideas?

Hi Rebecca,

The event listener for add record should be submit-form-success-listxx for now, from the latest news I know (though I have to test it - UPDATE = It is indeed submit-form-success-listxx listxx being the id/name of your block)

If you have issues to build the correct script, I can do it for you by replying here. If so, would you mind giving me the name of the block where the add record button is?
Also this block is inside a modal? You want to reload the parent page or the child page? (child page being the modal page)

Hi @matthieu_chateau thanks for your reply and offer to help! So I do have it reloading once the add record is submitted. The block and add record are in the same block and on the same page.

window.addEventListener('submit-form-success-requests-list', (e) => {
	console.log('add record success', e.detail);

    sessionStorage.setItem('scrollPosition', window.scrollY || window.pageYOffset);

    // Trigger the page reload
    window.location.reload();
});

However it’s not allowing for a delay in load. I tried this and it didn’t pause on reload

window.onload = function() {
    if (sessionStorage.getItem('scrollPosition') !== null)
        window.scrollTo(0, sessionStorage.getItem('scrollPosition'));
}

window.addEventListener('submit-form-success-requests-list', (e) => {
	console.log('add record success', e.detail);

    sessionStorage.setItem('scrollPosition', window.scrollY || window.pageYOffset);

    // Trigger the page reload
        setTimeout(() => {
        window.location.reload();
    }, 15000);
});

Thanks for your help!

Please try this one (delay of 1500 milliseconds - 1.5 seconds)

window.addEventListener('submit-form-success-requests-list', (e) => {
    console.log('add record success', e.detail);

    sessionStorage.setItem('scrollPosition', window.scrollY || window.pageYOffset);

    setTimeout(() => {
        window.location.reload();
    }, 1500);
});

Or this one as I think you want to automatically scroll to the stored position

window.addEventListener('submit-form-success-requests-list', (e) => {
    console.log('add record success', e.detail);

    const scrollPosition = window.scrollY || window.pageYOffset;
    sessionStorage.setItem('scrollPosition', scrollPosition);

    setTimeout(() => {
        window.scrollTo(0, scrollPosition);
        window.location.reload();
    }, 1500);
});

Hey Matthieu
Were the sign-in and sign-up listeners added? if so, what were they and could you update your code?

I have to check some details with the team before.
There will be a specific thread inside the guides and help section of the community.

As promised, here it is : Complete guide: Redirect users to the page they were before signing up/signing in + use case

1 Like

Thank you so much Matthieu!