mlyon avatar image
mlyon asked mgc commented

How to reset the hosted iframe (or "unmount" elements)?

I'm attempting to use the hosted iframe in an SPA that generates forms dynamically with javascript (using the Dojo framework). The SPA will create the form, create the Clover object, mount the elements, and then after the form is submitted, the form is removed from the DOM. This can happen multiple times without reloading the page.

This is working great. However, I've noticed that after subsequent forms are created, and the new Clover elements are created/mounted and clover.createToken() is called, the token endpoint gets hit multiple times. If I've generated 5 forms, then the 5th time calling createToken() will send 5 requests to the token API all at the same time, even though the previous forms don't even exist in the DOM anymore.

I've tried creating a new Clover() object for each form, as well as re-using the existing Clover object. But I can't seem to figure out how to avoid this from happening, and after inspecting the Clover and Element objects, it doesn't seem like there are any methods to reset or unmount them. I also tried only creating one set of elements and re-mounting them to the different forms, but it seems they can only be mounted once.

Is there a way to reset the iframes for a new form, without reloading the page? Or any insight into why calling createToken() on a new form ends up sending multiple duplicate requests?

I will try to create a piece of sample code to demo this problem, but if anyone has any tips for me in the meantime it would be much appreciated!

e-commerce api
10 |2000

Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

1 Answer

David Marginian avatar image
David Marginian Deactivated answered mgc commented

This is a known issue that hasn't been resolved yet. For now, you will have to find and manually remove the generated iframe.

10 |2000

Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

mlyon avatar image mlyon commented ·

Ok, is it just the iframe with the title="INTERMEDIATE" that needs to be removed?

0 Likes 0 ·
David Marginian avatar image David Marginian ♦♦ mlyon commented ·

I am not certain. Can you experiment with it a bit and let us know?

-1 Like -1 ·
mlyon avatar image mlyon David Marginian ♦♦ commented ·

Removing the iframe with title="INTERMEDIATE" from the DOM before the next form is mounted does indeed seem to resolve the problem. Thanks for the suggestion!

0 Likes 0 ·
Show more comments
Show more comments

Write an Answer

Hint: Notify or tag a user in this post by typing @username.

Up to 2 attachments (including images) can be used with a maximum of 512.0 KiB each and 1.0 MiB total.

Welcome to the
Clover Developer Community