Passing a web page URL parameter to a Leap app in an iframe
Use Case
You want to send a Leap notification with a link to web page and have a specific Leap record load (vs new form) in an iframe. This could be a follow-up notification where you want direct the user to a specific web page and have them see or edit a specific record. This is a common requirement when building customer and partner portals. In these scenarios you typically want to direct all interaction back to a portal vs sending them to a standalone Leap app.
How to setup
Two things you need to do this:
In the Leap App Sending the Notification
In the Leap app sending the notification you need to
Determine what the record ID is.
To build the URL to the web page which include the record ID as a parameter.
This can be done with the code below
var recID = BO.getDataId(); // this gets the record ID // this builds the URL to the record var webPageURL = 'https://yourwebpage'; //enter the url to the web page you want to send the user to var URL = webPageURL + '?id='+ recID; //this appends the record ID as a parameter to the url //this stores the URL in a field so you can use it in your notification BO.F_Single4.setValue(URL); // store in the field you have set in your app. If the URL is long you might have to store in a multiline field.
On the Web Page you are Sending the User to
2. Next you need to add some JavaScript to the web page you are link to that reads the URL parameter and adds it to the iframe which displays the Leap app. This can be done with the follow code:
<!-- this sets up the iframe shell --> <iframe width = "70%" height="600" id="myIframe" src="" frameborder="0"></iframe> <!-- script which gets the parameter and sets the iframe src property --> <script> window.onload = function(){ url = document.location.href; var paramId = new URL(url).searchParams.get("id"); var frameElement = document.getElementById("myIframe"); <!-- if parameter is there the frame is set to load with it --> if (paramId !== null) { frameElement.src = 'http://leapsandbox.hclpnp.com/forms/secure/1/app/2cff1ab9-1e7d-4ddf-98bb-60844257c9c2/launch/index.html?form=F_Form1&id='+ paramId; } <!-- otherwise it loads without the parameter --> else { frameElement.src = 'http://leapsandbox.hclpnp.com/forms/secure/1/app/2cff1ab9-1e7d-4ddf-98bb-60844257c9c2/launch/index.html?form=F_Form1'; } } </script>
Demo Example
HTML Code Used Below
The two URLs below will bring up a web page with a Leap app in an iframe. The URL with the parameter will bring up the Leap app with that record.
Page with Empty Form
http://leapsandbox.hclpnp.com/Sandbox2/IframeParamExample.html
Page with Specific Record