<web>

The <web> element provides the ability to customize the appearance of the output when rendering a QuickApp to the web. (Available as of prod-9)

Syntax

<dynamic>
  <render>
    <web into_="iframe|window|browsertab"/>    
  </render>
</dynamic>

Attributes

The following attributes may be specified to the <web> child element of the <render> tag.
Note: These attributes may also be supplied directly to the <render> element for the same effect. For more information, see <render>.
theme_
When rendering to a web target, the theme_ attribute changes certain style elements in a QuickApp based on predefined palettes.

Valid values are:

  • black
  • blueopal
  • bootstrap
  • kendo
  • flat
  • highcontrast
  • material
  • materialblack
  • metro
  • metroblack
  • moonlight
  • silver
  • uniform

As of version 10.15, the value of this attribute can be an expression that can be evaluated in the <dynamic> context. If the value of the expression changes, this render property is changed dynamically in the QuickApp.

background_
When rendering to a web target, this attribute specifies the background color for the QuickApp.

The color can be specified as any valid HTML color name, an RGB value, or a hex value.

As of version 10.15, the value of this attribute can be an expression that can be evaluated in the <dynamic> context. If the value of the expression changes, this render property is changed dynamically in the QuickApp.

(Available as of version 10.06)

into_
When rendering to a web target, this attribute specifies whether the QuickApp should be rendered into an iframe, a new window, or a new browser tab.

Valid values are:

iframe
Render into an iframe.
window
Render into a new browser window.
browsertab
Render into a new browser tab.
showprogressbar_
Specifies whether the default progress bar is displayed. Accepts 1 or 0.
warnbeforeleave_
For standalone QuickApps, this attribute specifies whether or not to show a dialog that asks for confirmation when the user tries to close the page. Accepts a 1 or 0.

On certain browsers (e.g., Chrome), when the user tries to close the page, a confirmation dialog is displayed only if the user has interacted with the QuickApp, regardless of the value of this attribute. If the user tries to close the page but has not interacted with the QuickApp, the confirmation dialog will not be displayed.

As of version 10.15, the value of this attribute can be an expression that can be evaluated in the <dynamic> context. If the value of the expression changes, this render property is changed on the fly; however, setting it to 0 when it was 1 will not disable an already enabled warning.

favicon_
Specifies the URL of a favicon that can be used for the page when rendering the QuickApp for the web.

(Available as of version 11.03)

Example: Specifying attributes at the <render> level

The following example demonstrates how render options can be specified to the <web> child element of the <render> tag. When this QuickApp is rendered to the web, it will be rendered into a new browser tab with a light blue background, as specified by the into_ and background_ attributes, respectively.

<dynamic>
  <render>
    <web into_="browsertab" background_="lightblue"/>
  </render>
  <widget class_="grid" base_="pub.demo.retail.item"/>
</dynamic>

Example: Display confirmation dialog when closing standalone QuickApp

This example demonstrates how setting warnbeforeleave_="1" in the <web> child element of <render> will prompt for confirmation when the browser window containing the standalone QuickApp is closed.

<dynamic selection="">
  <render>
    <web into_="browsertab" warnbeforeleave_="1"/>
  </render>
  <widget class_="dropdown" base_="pub.demo.retail.item" 
   value_="@selection"/>
</dynamic>