cObject
---cWebObject
------cWebBaseUIObject
---------cWebBaseDEOServer
------------cWebBaseControl
---------------cWebIFrame
Use the cWebIFrame class to insert an IFrame inside your web view or dialog (cWebView, cWebModalDialog). An HTML IFrame is designed to embed one web page within another. The web page can be any content that is supported by the client application (Browser).
IFrame controls are ideal for embedding documents (such as .pdf files), images or other web pages in your view or dialog.
The location of the IFrame in your HTML is determined by the position of the cWebIFrame object. The IFrame you insert is wrapped inside the framework's web control HTML element structure. This sandboxes the inserted content in a way that it should conform to the framework's column layout system, control labels (psLabel) and application theme support (psTheme).
Despite this sandboxing, it is always possible to insert content that will 'abuse' the client HTML generated and managed by your web application. You should test the content that you are inserting and understand its impact on the rest of your application's HTML.
If you wish to embed a single HTML element or a portion of HTML, then use the cWebHTMLBox control. If you wish to embed an image, the cWebImage control is specifically designed for this purpose.
Object oInventory is a cWebView
Set psCaption to "Inventory Browser"
Set piColumnCount to 3
Set pbClearAfterSave to False
Set piWidth to 750
Object oInvt_DD is a Invt_DataDictionary
End_Object
Set Main_DD to oInvt_DD
Set Server to oInvt_DD
Object oItem_ID is a cWebForm
Set psLabel to "Stock Code:"
Entry_Item Invt.Item_ID
End_Object
Object oDescription is a cWebForm
Set psLabel to "Description:"
Set piColumnIndex to 1
Set piColumnSpan to 2
Entry_Item Invt.Description
End_Object
Object oCatalog is a cWebIFrame
Set piHeight to 500
Set psUrl to "Catalogs/LumberCatalog.pdf"
End_Object
Object oPaversBtn is a cWebButton
Set psCaption to "Show Pavers"
Procedure OnClick
WebSet psURL of oCatalog to "Catalogs/PaversCatalog.pdf"
End_Procedure
End_Object
End_Object
The above example demonstrates a web view with two web forms for browsing data from the Inventory table. Below this, an IFrame is used to embed a .pdf file (LumberCataLog.pdf) located in the Catalogs sub-folder of the web application's URL. This is followed by a web button. The button's OnClick event uses the WebSet command to change the .pdf file displayed in the IFrame.
This example also demonstrates the use of the Set command, to set the design-time value of psURL, and the WebSet command to change the local value of psURL for the client that made the OnClick call.
The Web Framework uniquely identifies each web object via a combination of the object hierarchy (object nesting), and object name. This means that web object names must be unique within their parent (i.e. each sibling web object must have a unique name).
IFrame controls must be placed within a web container (e.g. cWebPanel, cWebView or cWebModalDialog).
IFrame controls may not be nested inside other web controls. You may not mix web panels and web controls as sibling objects.
Set psURL to the URL of the content you wish to insert in the IFrame.
Object oIFrame is a cWebIFrame
Set psUrl to "PDFs/LumberCatalog.pdf"
//...
End_Object
In the above example, the URL represents a file (LumberCataLog.pdf) located in the PDFs sub folder of the web application's URL. Any file that is located in the web application's URL (or a sub folder) can be referenced in this way.
Object oIFrame is a cWebIFrame
Set psUrl to "http://www.dataaccess.com/PDFs/LumberCatalog.pdf"
//...
End_Object
In the above example, the entire URL to a file (LumberCataLog.pdf) is specified. This file may be located in any reachable URL.
Web controls are positioned by HTML flow layout (left to right, top to bottom). The relative position of the control in this flow is determined by the location of the object declaration in your code.
In addition to the flow layout, each web container is divided into a fixed number of equal-width columns (piColumnCount). Child controls are aligned to these columns to determine their horizontal position and width.
Set piColumnIndex to position an IFrame control in a particular column of the parent container.
Set piColumnSpan to determine the width of the IFrame control i.e., the number of columns occupied by the control. The actual width is determined by the number of columns and the width of the parent container.
For more information, see Positioning and Layout of Controls.
Each IFrame control has a pre-determined minimum height according to the web application's CSS theme (psTheme). Set piHeight to set the IFrame control to a fixed pixel height. You can also instruct an IFrame control to occupy all available vertical height in its parent container by setting pbFillHeight to true.
The piHeight and pbFillHeight properties are mutually exclusive and should not be used together in the same object.
By default a portion of the control's width is reserved to display a descriptive label. By default, the label is displayed to the left of the control and consumes approximately 120px of the total width.
Set psLabel to the text string you want to display as a label.
Set peLabelAlign to position the label text to the left, right or center of the space allocated to the control's label (alignLeft, alignRight, alignCenter).
Set peLabelPosition to change the position of the space allocated to the control's label. By default, the label is positioned to the left of the control (lpLeft). The label can also be positioned above or to the right of the control (lpTop, lpRight).
Set piLabelOffset to change the amount of space that is consumed by the control's label. By default, the label consumes approximately 120px.
The label's text color is determined by the web application's CSS theme (psTheme). Set psLabelColor to directly override the label's CSS themed color.
Set pbShowLabel to false to hide the label and remove space used the control's label. By default, pbShowLabel is true.
This control can be used as a valid drop target by registering it as such in a cWebDragDropHelper object.
The supported actions for this control are:
- C_WebDropOnControl
This allows the control to accept data dragged from elsewhere in the control (if configured that way) and can also be used to accept files when registered within a cWebDragDropFileHelper.
The color of an IFrame control is determined by the web application's CSS theme (psTheme). You can define additional or replacement CSS styles in your web application's application.css file. Set psCSSClass to the CSS class name you would like to be applied to an IFrame control.
Set psBackgroundColor and psTextColor to directly override the control's CSS themed color.
Set pbShowBorder to True to draw a border around the IFrame.