Redirect to external links after record update through action button

Custom Coding
1

Hi,

Anyone can help on this? I want a redirection to a new url after the record being updated? I am trying to use the following, but it doesn’t work. Any insight on it?

</>
window.addEventListener(‘submit-form-success-form1’, (e) => {
console.log(‘form submit success’, e.detail);
myRecord.update()
.then(() => {
page.linkUrl = “https://www.jimsbond.com”;
page.redirectTo();
});
});
</>

Appreciate yr kind help.

Eric

2

window.addEventListener(‘update-record-success-list-details1’, (e) => {

console.log(‘update record success’, e.detail);

I have tried to change the 1st 2 lines, but still no response.

3

Hi,

Here is the code that would work for you:

<script>
document.addEventListener('DOMContentLoaded', () => {
  window.addEventListener('update-record-success-list-details1', () => {
    window.location.href = 'https://www.jimsbond.com';
  });
});
</script>

Or, if the records to update (and as a consequence, the list-details block) are inside a classic modal

<script>
document.addEventListener('DOMContentLoaded', () => {
  window.addEventListener('update-record-success-list-details1', () => {
    window.parent.location.href = 'https://www.jimsbond.com';
  });
});
</script>
4

Hi Matthieu,

That’s great, it works! However, if it is possible to show up as a modal one? Since I don’t want to show the url in a browser. I know there are three kinds of modal size? Any specifications could be found?

Really appreciate your kindness in assisting me.

Brgds

Eric

5

Open a Softr modal to open the url? No that’s not possible.
My advice: don’t be stuck on such things, showing or not the url in the browser has 0 consequence for users, UX or your business. And they will always be able to find it.

You can always use this code to open it in a popup but your users should allow this in their browser settings which is not always the case. Moreover: it will give the url :sweat_smile: + no customization + really not a great UX

<script>
document.addEventListener('DOMContentLoaded', () => {
  window.addEventListener('update-record-success-list-details1', () => {
    const popupWindow = window.open('https://www.jimsbond.com', '_blank', 'width=500,height=500');
    if (popupWindow) {
      popupWindow.focus();
    } else {
      alert('Popup window could not be opened. Please check your browser settings and try again.');
    }
  });
});
</script>

If the update occurs in a Softr modal and you want to stay in the Softr modal after redirection => just use the very first code I gave you in this thread (to be inserted in the modal page - child page)

<script>
document.addEventListener('DOMContentLoaded', () => {
  window.addEventListener('update-record-success-list-details1', () => {
    window.location.href = 'https://www.jimsbond.com';
  });
});
</script>
6

Thanks for you advice. The reason why I want it to be this is that the last page is showing a redemption success msg. Therefore, I want to show it like a pop-up so that it won’t be easily be recorded in bookmark.

Is there anyway easy way that I can bring those dynamic data from the list and form to the new page? Any specific code that could be applied?

7

Not that I know, it would need a much more complex script to perform it.
That being said, the solution might not need any code, if the redirection is made within your app. Playing with list-details block in the new page is often a solution. That’s all I can do to help you

1 Like
8

Is EventListener unique to this example. Is that what the record primary field title would be called?

1 Like
9

Hi,
The event listener has nothing to do with a primary field. It’s about the whole update action. When you click “update” in the action modal and the update is a success => it redirects to an external link of your choice. You just have to change list-details1 by the ID of the block where the update occurs and the https://.....

The event listener for a successful update is 'update-record-success-blockID'. In this example, the update occurs in a block called list-details1.