HTMLWidget Widget

Use this widget to render any HTML code.

Last published at: June 3rd, 2024

Description:

Use this widget on the form to accept any HTML code and render.

Inputs

  • Name - Name of the widget generated by FlowWright
  • Default Value - Provide the HTML code 
  • Hide - Select the checkbox to Hide (tick mark)
  • Save - Save the input values
  • Delete - Remove this form widget from the designer page 
  • Close - Close the input popup window
 

 

Design:

 

 

Example:

Let's build and execute the “HTMLWidgetDef” example

  • Create a new form definition called “HTMLWidgetDef” 
  • Select the Open Designer checkbox and click the “Create” button
  • Drag a HTML widget to the canvas
  • Double-click on the widget to configure the “Settings” properties. Provide a name to the control. Click on the icon </> to input the HTML data. 

 

  • Save the form definition and preview

 

  • Double-click on the widget to configure the inputs, as shown in the below graphic. Click on the icon </> to input the HTML data. 

 

  • Save the form definition and preview

 

  • The HTML code sample here
<div class="mapouter"><div class="gmap_canvas"><iframe class="gmap_iframe" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?width=600&amp;amp;height=400&amp;hl=en&amp;q=University of OxFlowwright 307 Waverley Oaks Road, Waltham, MA 02452, USAford&amp;t=&amp;z=14&amp;ie=UTF8&amp;iwloc=B&amp;output=embed"></iframe><a href="https://mcpenation.com/">MCPE Nation</a></div><style>.mapouter{position:relative;text-align:right;width:600px;height:400px;}.gmap_canvas {overflow:hidden;background:none!important;width:600px;height:400px;}.gmap_iframe {width:600px!important;height:400px!important;}</style></div>