Object Page with LazyLoading without blocks
This sample showcases the lazy loading using the stashed property of the ObjectPageLazyLoader. It enables usage of lazy loading without the need to have Blocks
Z2UI5_CL_SMPC_APP_592
Controls
sap.uxap
UI5 1.71
The facts
- Repository
- abap2UI5/samples-controls
- Class
Z2UI5_CL_SMPC_APP_592- Source file
z2ui5_cl_smpc_app_592.clas.abap↗- Library
- sap.uxap
- UI5 entity
sap.uxap.ObjectPageLayout- Demo kit sample
sap.uxap.sample.ObjectPageLazyLoadingWithoutBlocks- SAP's own sample
- running at sdk.openui5.org ↗
- Minimum UI5
- 1.71 — the floor abap2UI5 holds its samples to
- In the playground
- runs in the browser, with no system and nothing installed
Keywords: objectpagelayout, object, layout, sap.uxap, objectpagelazyloadingwithoutblocks, objectpagedynamicheadertitle, title, button, overflowtoolbarbutton, objectpagesection, objectpagesubsection, objectpagelazyloader
Controls it builds
- sap.m.Button
- sap.m.Label
- sap.m.OverflowToolbarButton
- sap.m.Text
- sap.m.Title
- sap.m.VBox
- sap.ui.core.mvc.View
- sap.ui.layout.form.SimpleForm
- sap.uxap.ObjectPageDynamicHeaderTitle
- sap.uxap.ObjectPageLayout
- sap.uxap.ObjectPageLazyLoader
- sap.uxap.ObjectPageSection
- sap.uxap.ObjectPageSubSection
Read out of the builder chain by the abap2UI5 linter, not from the category this sample is filed under — which is what makes “which samples build one of these” a question the catalogue can answer at all.
Libraries
Run it here
The sample running, in this page — the app on its own, with no editor over it.
Switch to Playground with this code
Nothing is installed and nothing is sent anywhere: the ABAP is compiled to JavaScript in this browser and runs against abap2UI5 itself.
The ABAP
z2ui5_cl_smpc_app_592.clas.abap — 1288 lines
Click a number to link to a line — shift-click for a range.
Read it on GitHub ↗
" @keywords objectpagelayout object layout sap.uxap objectpagelazyloadingwithoutblocks objectpagedynamicheadertitle title button overflowtoolbarbutton objectpagesection objectpagesubsection objectpagelazyloader
" @summary This sample showcases the lazy loading using the stashed property of the ObjectPageLazyLoader. It enables usage of lazy loading without the need to have Blocks
CLASS z2ui5_cl_smpc_app_592 DEFINITION PUBLIC.
PUBLIC SECTION.
INTERFACES z2ui5_if_app.
" the view's bindElement( '/SupplierCollection/0' ) folded onto root fields
DATA supplier_name TYPE string.
DATA street TYPE string.
DATA housenumber TYPE string.
DATA zipcode TYPE string.
DATA city TYPE string.
DATA country TYPE string.
PROTECTED SECTION.
DATA client TYPE REF TO z2ui5_if_client.
METHODS view_display.
METHODS model_init.
PRIVATE SECTION.
ENDCLASS.
CLASS z2ui5_cl_smpc_app_592 IMPLEMENTATION.
METHOD z2ui5_if_app~main.
me->client = client.
IF client->check_on_init( ).
model_init( ).
view_display( ).
ELSEIF client->check_on_navigated( ).
view_display( ).
ENDIF.
ENDMETHOD.
METHOD view_display.
DATA(view) = z2ui5_cl_ui5_view_builder=>factory( ).
" twenty-one identical sections, each a stashed ObjectPageLazyLoader around the
" same Address form - which is the sample: lazy loading WITHOUT custom blocks
view->ele( n = `View` ns = `mvc`
)->a( n = `height` v = `100%`
)->a( n = `xmlns` v = `sap.uxap`
)->a( n = `xmlns:mvc` v = `sap.ui.core.mvc`
)->a( n = `xmlns:m` v = `sap.m`
)->a( n = `xmlns:f` v = `sap.ui.layout.form`
)->ele( `ObjectPageLayout`
)->a( n = `id` v = `ObjectPageLayout`
)->a( n = `enableLazyLoading` v = `true`
)->a( n = `upperCaseAnchorBar` v = `false`
)->ele( `headerTitle`
)->ele( `ObjectPageDynamicHeaderTitle`
)->ele( `heading`
)->tag( n = `Title` ns = `m`
)->a( n = `text` v = `ObjectPage with LazyLoading without the use of Blocks`
)->end(
)->ele( `snappedTitleOnMobile`
)->tag( n = `Title` ns = `m`
)->a( n = `text` v = `ObjectPage with LazyLoading without the use of Blocks`
)->end(
)->ele( `actions`
)->tag( n = `Button` ns = `m`
)->a( n = `text` v = `Edit`
)->a( n = `type` v = `Emphasized`
)->tag( n = `Button` ns = `m`
)->a( n = `type` v = `Transparent`
)->a( n = `text` v = `Delete`
)->tag( n = `Button` ns = `m`
)->a( n = `type` v = `Transparent`
)->a( n = `text` v = `Copy`
)->tag( n = `OverflowToolbarButton` ns = `m`
)->a( n = `icon` v = `sap-icon://action`
)->a( n = `type` v = `Transparent`
)->a( n = `text` v = `Share`
)->a( n = `tooltip` v = `action`
)->end(
)->end(
)->end(
)->ele( `sections`
)->ele( `ObjectPageSection`
)->a( n = `titleUppercase` v = `false`
)->a( n = `title` v = `my section`
)->ele( `subSections`
)->ele( `ObjectPageSubSection`
)->a( n = `title` v = `Section 1`
)->a( n = `mode` v = `Expanded`
)->a( n = `id` v = `Section1`
)->a( n = `titleUppercase` v = `false`
)->ele( `blocks`
)->ele( `ObjectPageLazyLoader`
)->a( n = `stashed` v = `true`
)->a( n = `id` v = `Section1stashed`
)->ele( n = `VBox` ns = `m`
)->a( n = `class` v = `sapUiSmallMargin`
)->ele( n = `SimpleForm` ns = `f`
)->a( n = `maxContainerCols` v = `2`
)->a( n = `editable` v = `false`
)->a( n = `layout` v = `ResponsiveGridLayout`
)->a( n = `title` v = `Address`
)->a( n = `labelSpanL` v = `3`
)->a( n = `labelSpanM` v = `3`
)->a( n = `emptySpanL` v = `4`
)->a( n = `emptySpanM` v = `4`
)->a( n = `columnsL` v = `1`
)->a( n = `columnsM` v = `1`
)->a( n = `width` v = `auto`
)->a( n = `class` v = `sapUxAPObjectPageSubSectionAlignContent`
)->ele( n = `content` ns = `f`
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Name`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( supplier_name )
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Street/No.`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( street ) } { client->_bind( housenumber ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `ZIP Code/City`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( zipcode ) } { client->_bind( city ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Country`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( country )
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->ele( `ObjectPageSection`
)->a( n = `titleUppercase` v = `false`
)->a( n = `title` v = `my section`
)->ele( `subSections`
)->ele( `ObjectPageSubSection`
)->a( n = `title` v = `Section 2`
)->a( n = `mode` v = `Expanded`
)->a( n = `id` v = `Section2`
)->a( n = `titleUppercase` v = `false`
)->ele( `blocks`
)->ele( `ObjectPageLazyLoader`
)->a( n = `stashed` v = `true`
)->a( n = `id` v = `Section2stashed`
)->ele( n = `VBox` ns = `m`
)->a( n = `class` v = `sapUiSmallMargin`
)->ele( n = `SimpleForm` ns = `f`
)->a( n = `maxContainerCols` v = `2`
)->a( n = `editable` v = `false`
)->a( n = `layout` v = `ResponsiveGridLayout`
)->a( n = `title` v = `Address`
)->a( n = `labelSpanL` v = `3`
)->a( n = `labelSpanM` v = `3`
)->a( n = `emptySpanL` v = `4`
)->a( n = `emptySpanM` v = `4`
)->a( n = `columnsL` v = `1`
)->a( n = `columnsM` v = `1`
)->a( n = `width` v = `auto`
)->a( n = `class` v = `sapUxAPObjectPageSubSectionAlignContent`
)->ele( n = `content` ns = `f`
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Name`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( supplier_name )
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Street/No.`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( street ) } { client->_bind( housenumber ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `ZIP Code/City`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( zipcode ) } { client->_bind( city ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Country`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( country )
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->ele( `ObjectPageSection`
)->a( n = `titleUppercase` v = `false`
)->a( n = `title` v = `my section`
)->ele( `subSections`
)->ele( `ObjectPageSubSection`
)->a( n = `title` v = `Section 3`
)->a( n = `mode` v = `Expanded`
)->a( n = `id` v = `Section3`
)->a( n = `titleUppercase` v = `false`
)->ele( `blocks`
)->ele( `ObjectPageLazyLoader`
)->a( n = `stashed` v = `true`
)->a( n = `id` v = `Section3stashed`
)->ele( n = `VBox` ns = `m`
)->a( n = `class` v = `sapUiSmallMargin`
)->ele( n = `SimpleForm` ns = `f`
)->a( n = `maxContainerCols` v = `2`
)->a( n = `editable` v = `false`
)->a( n = `layout` v = `ResponsiveGridLayout`
)->a( n = `title` v = `Address`
)->a( n = `labelSpanL` v = `3`
)->a( n = `labelSpanM` v = `3`
)->a( n = `emptySpanL` v = `4`
)->a( n = `emptySpanM` v = `4`
)->a( n = `columnsL` v = `1`
)->a( n = `columnsM` v = `1`
)->a( n = `width` v = `auto`
)->a( n = `class` v = `sapUxAPObjectPageSubSectionAlignContent`
)->ele( n = `content` ns = `f`
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Name`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( supplier_name )
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Street/No.`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( street ) } { client->_bind( housenumber ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `ZIP Code/City`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( zipcode ) } { client->_bind( city ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Country`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( country )
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->ele( `ObjectPageSection`
)->a( n = `titleUppercase` v = `false`
)->a( n = `title` v = `my section`
)->ele( `subSections`
)->ele( `ObjectPageSubSection`
)->a( n = `title` v = `Section 4`
)->a( n = `mode` v = `Expanded`
)->a( n = `id` v = `Section4`
)->a( n = `titleUppercase` v = `false`
)->ele( `blocks`
)->ele( `ObjectPageLazyLoader`
)->a( n = `stashed` v = `true`
)->a( n = `id` v = `Section4stashed`
)->ele( n = `VBox` ns = `m`
)->a( n = `class` v = `sapUiSmallMargin`
)->ele( n = `SimpleForm` ns = `f`
)->a( n = `maxContainerCols` v = `2`
)->a( n = `editable` v = `false`
)->a( n = `layout` v = `ResponsiveGridLayout`
)->a( n = `title` v = `Address`
)->a( n = `labelSpanL` v = `3`
)->a( n = `labelSpanM` v = `3`
)->a( n = `emptySpanL` v = `4`
)->a( n = `emptySpanM` v = `4`
)->a( n = `columnsL` v = `1`
)->a( n = `columnsM` v = `1`
)->a( n = `width` v = `auto`
)->a( n = `class` v = `sapUxAPObjectPageSubSectionAlignContent`
)->ele( n = `content` ns = `f`
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Name`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( supplier_name )
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Street/No.`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( street ) } { client->_bind( housenumber ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `ZIP Code/City`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( zipcode ) } { client->_bind( city ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Country`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( country )
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->ele( `ObjectPageSection`
)->a( n = `titleUppercase` v = `false`
)->a( n = `title` v = `my section`
)->ele( `subSections`
)->ele( `ObjectPageSubSection`
)->a( n = `title` v = `Section 5`
)->a( n = `mode` v = `Expanded`
)->a( n = `id` v = `Section5`
)->a( n = `titleUppercase` v = `false`
)->ele( `blocks`
)->ele( `ObjectPageLazyLoader`
)->a( n = `stashed` v = `true`
)->a( n = `id` v = `Section5stashed`
)->ele( n = `VBox` ns = `m`
)->a( n = `class` v = `sapUiSmallMargin`
)->ele( n = `SimpleForm` ns = `f`
)->a( n = `maxContainerCols` v = `2`
)->a( n = `editable` v = `false`
)->a( n = `layout` v = `ResponsiveGridLayout`
)->a( n = `title` v = `Address`
)->a( n = `labelSpanL` v = `3`
)->a( n = `labelSpanM` v = `3`
)->a( n = `emptySpanL` v = `4`
)->a( n = `emptySpanM` v = `4`
)->a( n = `columnsL` v = `1`
)->a( n = `columnsM` v = `1`
)->a( n = `width` v = `auto`
)->a( n = `class` v = `sapUxAPObjectPageSubSectionAlignContent`
)->ele( n = `content` ns = `f`
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Name`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( supplier_name )
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Street/No.`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( street ) } { client->_bind( housenumber ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `ZIP Code/City`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( zipcode ) } { client->_bind( city ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Country`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( country )
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->ele( `ObjectPageSection`
)->a( n = `titleUppercase` v = `false`
)->a( n = `title` v = `my section`
)->ele( `subSections`
)->ele( `ObjectPageSubSection`
)->a( n = `title` v = `Section 6`
)->a( n = `mode` v = `Expanded`
)->a( n = `id` v = `Section6`
)->a( n = `titleUppercase` v = `false`
)->ele( `blocks`
)->ele( `ObjectPageLazyLoader`
)->a( n = `stashed` v = `true`
)->a( n = `id` v = `Section6stashed`
)->ele( n = `VBox` ns = `m`
)->a( n = `class` v = `sapUiSmallMargin`
)->ele( n = `SimpleForm` ns = `f`
)->a( n = `maxContainerCols` v = `2`
)->a( n = `editable` v = `false`
)->a( n = `layout` v = `ResponsiveGridLayout`
)->a( n = `title` v = `Address`
)->a( n = `labelSpanL` v = `3`
)->a( n = `labelSpanM` v = `3`
)->a( n = `emptySpanL` v = `4`
)->a( n = `emptySpanM` v = `4`
)->a( n = `columnsL` v = `1`
)->a( n = `columnsM` v = `1`
)->a( n = `width` v = `auto`
)->a( n = `class` v = `sapUxAPObjectPageSubSectionAlignContent`
)->ele( n = `content` ns = `f`
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Name`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( supplier_name )
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Street/No.`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( street ) } { client->_bind( housenumber ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `ZIP Code/City`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( zipcode ) } { client->_bind( city ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Country`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( country )
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->ele( `ObjectPageSection`
)->a( n = `titleUppercase` v = `false`
)->a( n = `title` v = `my section`
)->ele( `subSections`
)->ele( `ObjectPageSubSection`
)->a( n = `title` v = `Section 7`
)->a( n = `mode` v = `Expanded`
)->a( n = `id` v = `Section7`
)->a( n = `titleUppercase` v = `false`
)->ele( `blocks`
)->ele( `ObjectPageLazyLoader`
)->a( n = `stashed` v = `true`
)->a( n = `id` v = `Section7stashed`
)->ele( n = `VBox` ns = `m`
)->a( n = `class` v = `sapUiSmallMargin`
)->ele( n = `SimpleForm` ns = `f`
)->a( n = `maxContainerCols` v = `2`
)->a( n = `editable` v = `false`
)->a( n = `layout` v = `ResponsiveGridLayout`
)->a( n = `title` v = `Address`
)->a( n = `labelSpanL` v = `3`
)->a( n = `labelSpanM` v = `3`
)->a( n = `emptySpanL` v = `4`
)->a( n = `emptySpanM` v = `4`
)->a( n = `columnsL` v = `1`
)->a( n = `columnsM` v = `1`
)->a( n = `width` v = `auto`
)->a( n = `class` v = `sapUxAPObjectPageSubSectionAlignContent`
)->ele( n = `content` ns = `f`
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Name`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( supplier_name )
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Street/No.`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( street ) } { client->_bind( housenumber ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `ZIP Code/City`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( zipcode ) } { client->_bind( city ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Country`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( country )
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->ele( `ObjectPageSection`
)->a( n = `titleUppercase` v = `false`
)->a( n = `title` v = `my section`
)->ele( `subSections`
)->ele( `ObjectPageSubSection`
)->a( n = `title` v = `Section 8`
)->a( n = `mode` v = `Expanded`
)->a( n = `id` v = `Section8`
)->a( n = `titleUppercase` v = `false`
)->ele( `blocks`
)->ele( `ObjectPageLazyLoader`
)->a( n = `stashed` v = `true`
)->a( n = `id` v = `Section8stashed`
)->ele( n = `VBox` ns = `m`
)->a( n = `class` v = `sapUiSmallMargin`
)->ele( n = `SimpleForm` ns = `f`
)->a( n = `maxContainerCols` v = `2`
)->a( n = `editable` v = `false`
)->a( n = `layout` v = `ResponsiveGridLayout`
)->a( n = `title` v = `Address`
)->a( n = `labelSpanL` v = `3`
)->a( n = `labelSpanM` v = `3`
)->a( n = `emptySpanL` v = `4`
)->a( n = `emptySpanM` v = `4`
)->a( n = `columnsL` v = `1`
)->a( n = `columnsM` v = `1`
)->a( n = `width` v = `auto`
)->a( n = `class` v = `sapUxAPObjectPageSubSectionAlignContent`
)->ele( n = `content` ns = `f`
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Name`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( supplier_name )
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Street/No.`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( street ) } { client->_bind( housenumber ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `ZIP Code/City`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( zipcode ) } { client->_bind( city ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Country`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( country )
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->ele( `ObjectPageSection`
)->a( n = `titleUppercase` v = `false`
)->a( n = `title` v = `my section`
)->ele( `subSections`
)->ele( `ObjectPageSubSection`
)->a( n = `title` v = `Section 9`
)->a( n = `mode` v = `Expanded`
)->a( n = `id` v = `Section9`
)->a( n = `titleUppercase` v = `false`
)->ele( `blocks`
)->ele( `ObjectPageLazyLoader`
)->a( n = `stashed` v = `true`
)->a( n = `id` v = `Section9stashed`
)->ele( n = `VBox` ns = `m`
)->a( n = `class` v = `sapUiSmallMargin`
)->ele( n = `SimpleForm` ns = `f`
)->a( n = `maxContainerCols` v = `2`
)->a( n = `editable` v = `false`
)->a( n = `layout` v = `ResponsiveGridLayout`
)->a( n = `title` v = `Address`
)->a( n = `labelSpanL` v = `3`
)->a( n = `labelSpanM` v = `3`
)->a( n = `emptySpanL` v = `4`
)->a( n = `emptySpanM` v = `4`
)->a( n = `columnsL` v = `1`
)->a( n = `columnsM` v = `1`
)->a( n = `width` v = `auto`
)->a( n = `class` v = `sapUxAPObjectPageSubSectionAlignContent`
)->ele( n = `content` ns = `f`
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Name`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( supplier_name )
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Street/No.`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( street ) } { client->_bind( housenumber ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `ZIP Code/City`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( zipcode ) } { client->_bind( city ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Country`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( country )
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->ele( `ObjectPageSection`
)->a( n = `titleUppercase` v = `false`
)->a( n = `title` v = `my section`
)->ele( `subSections`
)->ele( `ObjectPageSubSection`
)->a( n = `title` v = `Section 10`
)->a( n = `mode` v = `Expanded`
)->a( n = `id` v = `Section10`
)->a( n = `titleUppercase` v = `false`
)->ele( `blocks`
)->ele( `ObjectPageLazyLoader`
)->a( n = `stashed` v = `true`
)->a( n = `id` v = `Section10stashed`
)->ele( n = `VBox` ns = `m`
)->a( n = `class` v = `sapUiSmallMargin`
)->ele( n = `SimpleForm` ns = `f`
)->a( n = `maxContainerCols` v = `2`
)->a( n = `editable` v = `false`
)->a( n = `layout` v = `ResponsiveGridLayout`
)->a( n = `title` v = `Address`
)->a( n = `labelSpanL` v = `3`
)->a( n = `labelSpanM` v = `3`
)->a( n = `emptySpanL` v = `4`
)->a( n = `emptySpanM` v = `4`
)->a( n = `columnsL` v = `1`
)->a( n = `columnsM` v = `1`
)->a( n = `width` v = `auto`
)->a( n = `class` v = `sapUxAPObjectPageSubSectionAlignContent`
)->ele( n = `content` ns = `f`
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Name`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( supplier_name )
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Street/No.`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( street ) } { client->_bind( housenumber ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `ZIP Code/City`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( zipcode ) } { client->_bind( city ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Country`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( country )
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->ele( `ObjectPageSection`
)->a( n = `titleUppercase` v = `false`
)->a( n = `title` v = `my section`
)->ele( `subSections`
)->ele( `ObjectPageSubSection`
)->a( n = `title` v = `Section 11`
)->a( n = `mode` v = `Expanded`
)->a( n = `id` v = `Section11`
)->a( n = `titleUppercase` v = `false`
)->ele( `blocks`
)->ele( `ObjectPageLazyLoader`
)->a( n = `stashed` v = `true`
)->a( n = `id` v = `Section11stashed`
)->ele( n = `VBox` ns = `m`
)->a( n = `class` v = `sapUiSmallMargin`
)->ele( n = `SimpleForm` ns = `f`
)->a( n = `maxContainerCols` v = `2`
)->a( n = `editable` v = `false`
)->a( n = `layout` v = `ResponsiveGridLayout`
)->a( n = `title` v = `Address`
)->a( n = `labelSpanL` v = `3`
)->a( n = `labelSpanM` v = `3`
)->a( n = `emptySpanL` v = `4`
)->a( n = `emptySpanM` v = `4`
)->a( n = `columnsL` v = `1`
)->a( n = `columnsM` v = `1`
)->a( n = `width` v = `auto`
)->a( n = `class` v = `sapUxAPObjectPageSubSectionAlignContent`
)->ele( n = `content` ns = `f`
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Name`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( supplier_name )
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Street/No.`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( street ) } { client->_bind( housenumber ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `ZIP Code/City`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( zipcode ) } { client->_bind( city ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Country`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( country )
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->ele( `ObjectPageSection`
)->a( n = `titleUppercase` v = `false`
)->a( n = `title` v = `my section`
)->ele( `subSections`
)->ele( `ObjectPageSubSection`
)->a( n = `title` v = `Section 12`
)->a( n = `mode` v = `Expanded`
)->a( n = `id` v = `Section12`
)->a( n = `titleUppercase` v = `false`
)->ele( `blocks`
)->ele( `ObjectPageLazyLoader`
)->a( n = `stashed` v = `true`
)->a( n = `id` v = `Section12stashed`
)->ele( n = `VBox` ns = `m`
)->a( n = `class` v = `sapUiSmallMargin`
)->ele( n = `SimpleForm` ns = `f`
)->a( n = `maxContainerCols` v = `2`
)->a( n = `editable` v = `false`
)->a( n = `layout` v = `ResponsiveGridLayout`
)->a( n = `title` v = `Address`
)->a( n = `labelSpanL` v = `3`
)->a( n = `labelSpanM` v = `3`
)->a( n = `emptySpanL` v = `4`
)->a( n = `emptySpanM` v = `4`
)->a( n = `columnsL` v = `1`
)->a( n = `columnsM` v = `1`
)->a( n = `width` v = `auto`
)->a( n = `class` v = `sapUxAPObjectPageSubSectionAlignContent`
)->ele( n = `content` ns = `f`
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Name`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( supplier_name )
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Street/No.`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( street ) } { client->_bind( housenumber ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `ZIP Code/City`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( zipcode ) } { client->_bind( city ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Country`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( country )
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->ele( `ObjectPageSection`
)->a( n = `titleUppercase` v = `false`
)->a( n = `title` v = `my section`
)->ele( `subSections`
)->ele( `ObjectPageSubSection`
)->a( n = `title` v = `Section 13`
)->a( n = `mode` v = `Expanded`
)->a( n = `id` v = `Section13`
)->a( n = `titleUppercase` v = `false`
)->ele( `blocks`
)->ele( `ObjectPageLazyLoader`
)->a( n = `stashed` v = `true`
)->a( n = `id` v = `Section13stashed`
)->ele( n = `VBox` ns = `m`
)->a( n = `class` v = `sapUiSmallMargin`
)->ele( n = `SimpleForm` ns = `f`
)->a( n = `maxContainerCols` v = `2`
)->a( n = `editable` v = `false`
)->a( n = `layout` v = `ResponsiveGridLayout`
)->a( n = `title` v = `Address`
)->a( n = `labelSpanL` v = `3`
)->a( n = `labelSpanM` v = `3`
)->a( n = `emptySpanL` v = `4`
)->a( n = `emptySpanM` v = `4`
)->a( n = `columnsL` v = `1`
)->a( n = `columnsM` v = `1`
)->a( n = `width` v = `auto`
)->a( n = `class` v = `sapUxAPObjectPageSubSectionAlignContent`
)->ele( n = `content` ns = `f`
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Name`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( supplier_name )
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Street/No.`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( street ) } { client->_bind( housenumber ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `ZIP Code/City`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( zipcode ) } { client->_bind( city ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Country`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( country )
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->ele( `ObjectPageSection`
)->a( n = `titleUppercase` v = `false`
)->a( n = `title` v = `my section`
)->ele( `subSections`
)->ele( `ObjectPageSubSection`
)->a( n = `title` v = `Section 14`
)->a( n = `mode` v = `Expanded`
)->a( n = `id` v = `Section14`
)->a( n = `titleUppercase` v = `false`
)->ele( `blocks`
)->ele( `ObjectPageLazyLoader`
)->a( n = `stashed` v = `true`
)->a( n = `id` v = `Section14stashed`
)->ele( n = `VBox` ns = `m`
)->a( n = `class` v = `sapUiSmallMargin`
)->ele( n = `SimpleForm` ns = `f`
)->a( n = `maxContainerCols` v = `2`
)->a( n = `editable` v = `false`
)->a( n = `layout` v = `ResponsiveGridLayout`
)->a( n = `title` v = `Address`
)->a( n = `labelSpanL` v = `3`
)->a( n = `labelSpanM` v = `3`
)->a( n = `emptySpanL` v = `4`
)->a( n = `emptySpanM` v = `4`
)->a( n = `columnsL` v = `1`
)->a( n = `columnsM` v = `1`
)->a( n = `width` v = `auto`
)->a( n = `class` v = `sapUxAPObjectPageSubSectionAlignContent`
)->ele( n = `content` ns = `f`
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Name`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( supplier_name )
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Street/No.`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( street ) } { client->_bind( housenumber ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `ZIP Code/City`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = |{ client->_bind( zipcode ) } { client->_bind( city ) }|
)->tag( n = `Label` ns = `m`
)->a( n = `text` v = `Country`
)->tag( n = `Text` ns = `m`
)->a( n = `text` v = client->_bind( country )
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->end(
)->ele( `ObjectPageSection`
)->a( n = `titleUppercase` v = `false`
)->a( n = `title` v = `my section`
)->ele( `subSections`
)->ele( `ObjectPageSubSection`
)->a( n = `title` v = `Section 15`
)->a( n = `mode` v = `Expanded`
)->a( n = `id` v = `Section15`
)->a( n = `titleUppercase` v = `false`
)->ele( `blocks`
)->ele( `ObjectPageLazyLoader`
)->a( n = `stashed` v = `true`
)->a( n = `id` v = `Section15stashed`
)->ele( n = `VBox` ns = `m`
)->a( n = `class` v = `sapUiSmallMargin`
)->ele( n = `SimpleForm` ns = `f`
)->a( n = `maxContainerCols` v = `2`
)->a( n = `editable` v = `false`
)->a( n = `layout` v = `ResponsiveGridLayout`
)->a( n = `title` v = `Address`
)->a( n = `labelSpanL` v = `3`
)->a( n = `labelSpanM` v = `3`
)->a( n = `emptySpanL` v = `4`
)->a( n = `emptySpanM` v = `4`The first 900 lines of 1288 — the whole class is on GitHub.
More in sap.uxap
- Object Page AnchorBar — AnchorBar has a different behavior based on the device
- Object Page AnchorBar with numbers — This example shows how to visualize numbers in parenthesis after the corresponding sectio…
- Object Page demonstrating beforeNavigate event — Object Page demonstrating how beforeNavigate event can be used to prevent default navigat…
- Object Page with blocks of different view types — ObjectPage sample with blocks that use different view types
- ObjectPage with first editable input — Object Page that focuses its first editable input in the currently selected section.
- ObjectPage with forms — Object Page automatically adjusts form layout to match block column layout
- Object Page with LazyLoading — Object Page with LazyLoading
- Object Page with predefined selected section in Tab navigation mode — Object Page sample showing a layout where the selected section is defined by the user.
- Object Page State — This example shows how the page can be accessed directly to a specific vertical position…
- Object Page using the Tab navigation mode — Object Page sample showing a layout where the navigation is Tab based (one Tab per sectio…
- Object Page built entirely in XML — An ObjectPageLayout declared in one XML view - header title, header content and five sect…
- Subsection with automatic layout of blocks — This example shows how blocks can be laid out automatically by the Object Page when their…
On this page