Add an iframe to a model-driven app main form

You can add inline frames (iframes) to a form to integrate content from another website within the form.

1. Select Tables on the left navigation pane, and then open the table that you want. If the item isn’t in the side panel pane, select …More and then select the item you want.

2. Select Forms from the Data experiences area.

3. In the list of forms, open a form of type Main.

4. In the form designer, select the section of the canvas where you want to add the iframe.

5. On the Components left pane, expand Display, select External website, enter the Site URL, and then select Done.

   

   Tab	Property	Description
   Display options	Label	Required: A label to display for the iframe.
   Display options	Name	Required: A unique name for the iframe. The name can contain only alphanumeric characters and underscores.
   Display options	Hide label	Select if you want the label hidden.
   Display options	Hide	You can hide the iframe so that it can be made visible by using scripts. More information: Visibility options
   Display options	URL	Required: The URL for the page to display in the iframe.
   Formatting	Column width	When the section containing the iframe has more than one column you can set the column to occupy up to the number of columns that the section has.
   Formatting	Component height	You can control the height of the iframe by specifying a number of rows the control occupies.
   Formatting	Use all available vertical space	Instead of setting the height by a number of rows, you can allow the iframe height to expand to available space.
   Formatting	Scrolling	You have three options for scrolling behavior: - As Necessary: Display scrollbars when the size of the iframe is larger than the available space. - Always: Always display scrollbars. - Never: Never display scrollbars.
   Formatting	Display border	Display a border around the iframe.
   Dependencies	Table column dependencies	An iframe may interact with columns in the form using script. If a column is removed from the form the script in the iframe may break. Add any columns referenced by scripts in the iframes to the Table column dependencies so that they can't be removed accidentally.
   Advanced	Restrict cross-frame scripting, where supported	It is considered a security risk to allow pages from a different web site to interact with the app using scripts. Use this option to restrict cross frame scripting for pages you do not have control over.
   Advanced	Pass row object-type code and unique identifiers as parameters	Data about the organization, user, and the record can be passed to the iframe. More information: Pass parameters to iframes

6. Save and Publish the form.

Note

• If the web page doesn't appear in the iframe, it might be because the website doesn't allow iframe rendering. When this occurs, the message URL refused to connect is displayed in the iframe at runtime.
• Forms are not designed to be displayed within an iframe.
• Authentication inside an iframe, either through a redirection or popups, isn't supported on mobile.

Pass parameters to iframes

Information about the row can be passed by enabling the Pass row object-type code and unique identifiers as parameters option. The values passed are:

Parameter	Description
orglcid	The Organization default language LCID.
orgname	The name of the organization.
userlcid	The user's preferred language LCID
type	The table type code. This value can be different for custom tables in different organizations. Use typename instead.
typename	The table type name.
id	The id value of the row. this parameter has no value until the table row is saved.

Add an iframe using the classic form designer

1. Sign in to Power Apps.

2. Select Tables on the left navigation pane, and then open the table that you want. If the item isn’t in the side panel pane, select …More and then select the item you want.

3. Select the Forms area.

4. In the list of forms, open a form of type Main.

5. Select Switch to classic to edit the form in the classic form designer.

6. On the Insert tab, select IFRAME to view iframde properties.

   

Tab	Property	Description
General	Name	Required: A unique name for the iframe. The name can contain only alphanumeric characters and underscores.
	URL	Required: The URL for the page to display in the iframe.
	Pass row object-type code and unique identifiers as parameters	Data about the organization, user, and the row can be passed to the iframe. More information: Pass parameters to iframes
	Label	Required: A label to display for the iframe.
	Display label on the Form	Whether the label should be displayed.
	Restrict cross-frame scripting, where supported	It is considered a security risk to allow pages from a different web site to interact with the Dynamics 365 application using scripts. Use this option to restrict cross frame scripting for pages you do not have control over.
	Visible by default	Showing the iframe is optional and can be controlled using scripts. More information: Visibility options
	Enable for mobile	Select the checkbox to enable the iframe for mobile.
Formatting	Select the number of columns the control occupies	When the section containing the iframe has more than one column you can set the column to occupy up to the number of columns that the section has.
	Select the number of rows the control occupies	You can control the height of the iframe by specifying a number of rows the control occupies.
	Automatically expand to use available space	Instead of setting the height by a number of rows, you can allow the iframe height to expand to available space.
	Select the scrolling type for the iFrame	You have three options: - As Necessary: Show scrollbars when the size of the iframe is larger than the available space. - Always: Always show scrollbars. - Never: Never show scrollbars.
	Display border	Display a border around the iframe.
Dependencies	Dependent columns	An iframe may interact with columns in the form using script. If a column is removed from the form the script in the iframe may break. Add any columns referenced by scripts in the iframes to the Dependent columns so that they cannot be removed accidentally.

Next steps

Use the Main form and its components