Fragment callback to check a triggered API response without reloading page?

Liberty Create - Build Advice
1

I’m building some functionality in a Webpage where the user interacts with an iframe, so out of the Liberty Create ecosystem.

That functionality in that iframe (another system) makes an API call in to a Liberty Create API function I expose.

The real world example is a user reporting the location of a Highway fault through on online form. The iframe shows a map, with a lot of GIS data from the Highways Management system. When the user clicks on a valid area of the map and actions “select this location”, the location is sent via an API (with this record ref).

How can I check that this location has been received without refreshing? I’ve tried to display the location property and refresh the fragment on when another fragment triggers a refresh event, but this doesn’t work. Only a page refresh or submit and return to this page, show the location updated.

2

I think you would need a Code Studio Presenter or Widget on the page that makes an AJAX request every few seconds to backend code which can do a record search to check the status. You can then use that to only reload the page once you have the location for example, or whatever you need to do at that point.

3

Thanks Bob, I’ll give that a go.
Short term I’ll work around this with a page after the ‘Submit’, but would like to improve the UX long term (your solution).

4

If you have control over the other frame’s content (i.e. could add JS to it) then you could also maybe make the frames talk to each other using the postmessage API Window.postMessage() - Web APIs | MDN
This requires custom JS in both frames, so that the inner frame could notify the outer frame when the location has been selected, but is only possible if you have control over both.