Dynamic creation of UI element in Web Dynpro


 

In this post UI elements like a Label and an input field is created dynamically and the input field is bound a context attribute designed statically.

Create a component and a context attribute.

The layout is FLOW Layout.

 To dynamically add UI elements the method WDDOMODIFYVIEW can be used.

 Put the below code to create a label and an input element.

———————————————————————————————————————

METHOD wddomodifyview .
DATA 

        lr_root_element TYPE REF TO if_wd_view_element,
lr_container TYPE REF TO cl_wd_uielement_container,
lr_label        TYPE REF TO cl_wd_label,
lr_input        TYPE REF TO cl_wd_input_field,
lr_flow_data    TYPE REF TO cl_wd_flow_data.

IF first_time abap_true.

CALL METHOD view->get_element
EXPORTING
id      ‘ROOTUIELEMENTCONTAINER’
RECEIVING
element lr_root_element.

lr_container ?= lr_root_element.
* Creating a Label
CALL METHOD cl_wd_label=>new_label
EXPORTING
id        ‘L_FLIGHT_CODE’
label_for ‘FLIGHT_CODE’
RECEIVING
control   lr_label.

CALL METHOD cl_wd_flow_data=>new_flow_data
EXPORTING
element lr_label
RECEIVING
control lr_flow_data.

CALL METHOD lr_label->set_layout_data
EXPORTING
the_layout_data lr_flow_data.

CALL METHOD lr_container->add_child
EXPORTING
” index     = 1
the_child lr_label.
* Creating an Input field
CALL METHOD cl_wd_input_field=>new_input_field
EXPORTING
bind_value ‘CARRID’
id         ‘FLIGHT_CODE’
RECEIVING
control    lr_input.

CALL METHOD cl_wd_flow_data=>new_flow_data
EXPORTING
element lr_input
RECEIVING
control lr_flow_data.

CALL METHOD lr_input->set_layout_data
EXPORTING
the_layout_data lr_flow_data.

CALL METHOD lr_container->add_child
EXPORTING
”   index     = 2
the_child lr_input.

ENDIF.
ENDMETHOD.


Create an application and test.


 

 

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

w

Connecting to %s