Show TOC

Background documentationcontainer Locate this document in the navigation structure

 

Creates a container that displays the default HTMLB-based tray for all iViews in the container.

Attributes

Name

Mandatory

Description

id

Yes

The ID of the container.

In the portalapp.xml for the PAR that includes the layout, this ID must be specified in a profile property called com.sap.portal.reserved.layout.Cont<X>. For more information, see How to Create a Custom Layout.

wrappingMethod

No

The wrapping method for single iViews within the container:

  • table: the container is rendered as a table with one column and multiple rows, with an iView in each cell. This is the default value, if the attribute is not specified.

  • div: each iView is wrapped in a div tag. There is no further surrounding HTML tag for the whole container.

  • none: no extra HTML output for the container and for the single iViews. The iView output is inserted into the overall output as is.

Note Note

If you define a designClass meta property for the container in the portalapp.xml, the table or div tag carries an extra class attribute with the designClass value. The value may be either one of the container CSS classes defined in a portal theme (prtlHeaderCon, prtlPageConF, prtlPageConL, prtlPageConM, prtlPageConR), or any other custom CSS class, defined in a custom CSS file included in the response.

End of the note.
Coordinating Tags

The tag must be nested in the following tag:

template

Example

The following creates a layout with two columns of equal size. All iViews in the containers are displayed with the default iView tray. The HTML code for runtime uses styled div tags, whereas the code for design time creates a table with the two half-width columns.

Example Example

  1. <%@ taglib uri="LayoutTagLibrary" prefix="lyt" %>
    <lyt:template>
        <lyt:IfRunTimeMode>
            <%
            response.include(componentRequest, 
                componentRequest.getResource("css", "css/custom.css"));
            %>
            <div class="floatLeftWidth50Percent">
                <lyt:container id="leftColumn" wrappingMethod="none"/>
            </div>
            <div class="floatRightWidth50Percent">
                <lyt:container id="rightColumn" wrappingMethod="none"/>
            </div>
            <div class="clearFloats"></div>
        </lyt:IfRunTimeMode>
        <lyt:IfDesignTimeMode>
            <table width="100%"><tr>
                <td width="50%" valign="top">
                    <lyt:container id="leftColumn"/>
                </td>
                <td width="50%" valign="top">
                    <lyt:container id="rightColumn"/>
                </td>
            </tr></table>
        </lyt:IfDesignTimeMode>
    </lyt:template>
    
End of the code.

More Information

containerWithTrayDesign