Show TOC

HTMLContainerLocate this document in the navigation structure

Definition

Use

UI elements HTMLContainer and HTMLIsland enable customer-defined HTML, JavaScript, and CSS sources to be integrated into Web Dynpro ABAP applications. This integration enables you to enhance standard Web Dynpro with new components.

Using HTMLContainers you can integrate HTML or JavaScript-based UI controls into your Web Dynpro application (for example, an enhanced UI control for processing formatted text), or enhancing Web Dynpro UI elements with HTML (for example, a Table with a background image).

Using the CONTENT aggregation you can insert HTMLFragments into the HTMLContainer. This means you can integrate entire HTML source code or HTML fragments that contain other contents into a Web Dynpro application. HTMLContainer creates HTML on the server side. The content of the HTMLContainer is completely rebuilt with each server roundtrip.

Context attributes are provided in HTMLContainer using the DATA_ELEMENTS aggregation. It is also possible to declare events to be triggered by the HTML application and processed by Web Dynpro Framework.

Note

Always run Web Dynpro applications that use UI elements to integrate HTML in the standard mode of the browser. To do this, set application parameter WDPREFERREDRENDERING to STANDARDS.

For more information see Application Parameters and URL Parameters.

For more information, see: HTML Integration

Implementation Details

Runtime Class:

CL_WD_HTML_CONTAINER

Properties in View Designer

Name

Type

Initial Value

Bindable

id

STRING

(automatic)

No

contextMenuBehaviour

WDUI_CONTEXT_MENU_BEHAVIOUR

inherit

No

contextMenuId

WDY_MD_UI_ELEMENT_REFERENCE

 

No

enabled

WDY_BOOLEAN

true

Yes

height

STRING

 

Yes

tooltip

Translatable text

 

Yes

visible

WDUI_VISIBILITY

visible

Yes

width

STRING

 

Yes

Aggregations in View Designer

Name

Cardinality

Type

CONTENT

0..n

UIElement

DATA_ELEMENTS

0..n

JSONData

EVENTS

0..n

HtmlEvent

SCRIPTS

0..n

HtmlScript

STYLES

0..n

HtmlStyle

Use
Note

Other properties that can be inherited are defined in the related higher-level classes. The related UI elements are:

Dynamic Programming

For dynamic programming, the same properties, events, and aggregations are available as in the View Designer. But note that the spelling format and use of upper/lower case is different.

View Designer Name

Runtime Name

Type

contextMenuBehaviour

CONTEXT_MENU_BEHAVIOUR

WDUI_CONTEXT_MENU_BEHAVIOUR

 contextMenuBehaviour: inherit

CL_WD_C_TABLE=>E_CONTEXT_MENU_BEHAVIOUR-INHERIT

 contextMenuBehaviour: provide

CL_WD_C_TABLE=>E_CONTEXT_MENU_BEHAVIOUR-PROVIDE

 contextMenuBehaviour: suppress

CL_WD_C_TABLE=>E_CONTEXT_MENU_BEHAVIOUR-SUPPRESS

contextMenuId

CONTEXT_MENU_ID

WDY_MD_UI_ELEMENT_REFERENCE

enabled

ENABLED

WDY_BOOLEAN

height

HEIGHT

STRING

tooltip

TOOLTIP

WDY_MD_TRANSLATABLE_TEXT

visible

VISIBLE

WDUI_VISIBILITY

 visible: none

CL_WD_C_TABLE=>E_VISIBLE-NONE

 visible: visible

CL_WD_C_TABLE=>E_VISIBLE-VISIBLE

width

WIDTH

STRING

View Designer Name

Runtime Name

Cardinality

CONTENT

CONTENT

0..n

DATA_ELEMENTS

DATA_ELEMENTS

0..n

EVENTS

EVENTS

0..n

SCRIPTS

SCRIPTS

0..n

STYLES

STYLES

0..n

Example

For tests, component WDR_TEST_HTML_ELEMENT is provided in the system.