Welcome, Guest

Login

Register

Getting Started

Newsletters

Store

Search the Comm

Products
Services & Support
About SCN
Downloads
Industries
Training & Education
Partnership
Developer Center

Lines of Business
University Alliances
Events & Webinars
Innovation

Skip to content

Skip to breadcrumbs

Skip to header menu

Skip to action menu

Skip to quick search

We are improving! Due to further refinements, our original planned dates for no new content of September 4th
through September 7th have been moved.
The SCN wiki will not be available for new content submission starting September 4th 6PM CET until
September 7 6PM CET. Please plan your SCN wiki tasks accordingly.
Spaces
Browse


Quick Search

1.

Tools

Code Gallery

Web Dynpro ABAP - Complex select-options component

usages
Skip to end of metadata

Attachments:9
Added by David Pietroniro, last edited by Smruti Ranjan Mohanty on Sep 26, 2013 (view change)
show comment
Go to start of metadata
Author: David Pietroniro
Submitted: 08/12/2008
Related Links:

User Interface Development with Web Dynpro for ABAP

Working with select-options in Web dynpro for ABAP

Using select-options in a Web Dynpro ABAP Application

Web dynpro for ABAP - Get Started

Description
In this I will explain how to use complex select-options components like groups, parameters and select-options with default
values and more. This assumes that you have a basic acknowledge of the Web Dynpro ABAP and have created a web
dynpro component via Object Navigator (transaction SE80).

Defining the used components

Go to the web dynpro component and add a WDR_SELECT_OPTIONS component like follows:

View VI_MAIN
Create a view by right clicking on the web dynpro component and choose Create->View. Define the view name as VI_MAIN.

Used Components
Now in tab Properties add the Used Components like follows:

Context
Now in the Context tab create a new node with name T_SBOOK, cardinality 0..n and defines the Dictionary Structure
SBOOK. Click on the button Add Attribute from Structure and add the fields like follows, the structure of the node must be
the following:

Layout
Go to the Layout tab and insert a View Container UI Element with id VC_SEL_OPT. Finally add a table to the view layout,
name it as TBL_SBOOK, right click the table and select the Create Binding option and bind the table to the T_SBOOK
context. Defines the Cell Editor as TextView and bound the attributes to the property text:

The Layout structure now is:

Attributes
In the Attributes tab add the attributes like follows:

Methods
Method BUILD_SELECT_OPTIONS
This method is responsible to create the select-options, add the group, fields and set its default values.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32

METHOD build_select_options .
TYPES:
ty_r_date TYPE RANGE OF s_date,
ty_s_date TYPE LINE OF ty_r_date.
* Reference variable used instantiate the select-options component
DATA
lr_cmp_usage TYPE REF TO if_wd_component_usage.
* Variables used to create the select-options fields and
* define its initial values
DATA:
lr_field TYPE REF TO data,
ls_date TYPE ty_s_date.
FIELD-SYMBOLS:
<fs_field> TYPE ANY,
<fs_range> TYPE INDEX TABLE.
* Instantiate the select-options component
lr_cmp_usage = wd_this->wd_cpuse_cmp_sel_opt( ).
IF lr_cmp_usage->has_active_component( ) IS INITIAL.
lr_cmp_usage->create_component( ).
ENDIF.
* Sets the helper reference
wd_this->m_sel_opt = wd_this->wd_cpifc_cmp_sel_opt( ).
wd_this->m_helper = wd_this->m_sel_opt->init_selection_screen( ).
* Hide the standard select-options components.
wd_this->m_helper->set_global_options(
i_display_btn_cancel = abap_false
i_display_btn_check = abap_false
i_display_btn_reset = abap_false ).
* Adding a block (type Tray) to the select-options
wd_this->m_helper->add_block(
i_id
= `BL01`
i_block_type = if_wd_select_options=>mc_block_type_tray
i_title
= `Flight Booking` ).

33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77

* Adding a parameter field to the created block

* Create a reference to the type of airline code
CREATE DATA lr_field TYPE s_carr_id.
* Sets the airline code initial value
ASSIGN lr_field->* TO <fs_field>.
<fs_field> = 'AA '.
* Add the parameter to the group
wd_this->m_helper->add_parameter_field(
i_id
= `CARRID`
i_within_block = `BL01`
i_value
= lr_field ).
FREE lr_field.
UNASSIGN <fs_field>.
* Adding a select-options field to the created block
* Create a reference to the connection number range table
lr_field = wd_this->m_helper->create_range_table( `S_CONN_ID` ).
* Add the select-option to the group
wd_this->m_helper->add_selection_field(
i_id
= `CONNID`
i_within_block = `BL01`
it_result
= lr_field ).
FREE lr_field.
* Adding a select-options field to the created block
* Create a reference to the flight date range table
lr_field = wd_this->m_helper->create_range_table( `S_DATE` ).
ASSIGN lr_field->* TO <fs_range>.
ls_date-sign
= 'I'.
ls_date-option = 'EQ'.
ls_date-low
= sy-datum - 7.
ls_date-high
= sy-datum.
APPEND ls_date TO <fs_range>.
* Add the select-option to the group
wd_this->m_helper->add_selection_field(
i_id
= `FLDATE`
i_within_block = `BL01`
it_result
= lr_field ).
ENDMETHOD.

Method EXECUTE_SEARCH
This method is an Event Handler for the event ON_EXECUTE of the component CMP_SEL_OPT and will retrieve the data
from the select-options and the database and then bind it to the context node S_BOOK.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43

METHOD execute_search .
TYPES:
lty_r_connid TYPE RANGE OF s_conn_id,
lty_r_fldate TYPE RANGE OF s_date.
DATA
lr_sbook
TYPE REF TO if_wd_context_node.
* Variables used to retrieve the values of select-options fields
DATA
lt_sel_item TYPE if_wd_select_options=>tt_selection_screen_item.
FIELD-SYMBOLS:
<fs_sel_item> LIKE LINE OF lt_sel_item,
<fs_carrid>
TYPE s_carr_id,
<fs_connid>
TYPE lty_r_connid,
<fs_fldate>
TYPE lty_r_fldate.
* Get the selection-screen items
wd_this->m_helper->get_selection_screen_items(
IMPORTING et_selection_screen_items = lt_sel_item ).
* Retrieve the values from the select-options items
LOOP AT lt_sel_item ASSIGNING <fs_sel_item>.
CASE <fs_sel_item>-m_id.
WHEN `CARRID`.
ASSIGN <fs_sel_item>-m_value->* TO <fs_carrid>.
WHEN `CONNID`.
ASSIGN <fs_sel_item>-mt_range_table->* TO <fs_connid>.
WHEN `FLDATE`.
ASSIGN <fs_sel_item>-mt_range_table->* TO <fs_fldate>.
ENDCASE.
ENDLOOP.
* Retrieve the data from the database, for simplicity, the
* SELECT statement has been implemented here.
SELECT * FROM sbook
INTO TABLE wd_this->t_sbook
WHERE carrid = <fs_carrid>
AND connid IN <fs_connid>
AND fldate IN <fs_fldate>.
* Bind the data to the context
lr_sbook = wd_context->get_child_node( name = `T_SBOOK`).
lr_sbook->bind_table( wd_this->t_sbook ).
ENDMETHOD.

Method WDDOINIT
Include a call to the method responsible by create the select-options.

1
2
3

method WDDOINIT .
wd_this->build_select_options( ).
endmethod.

Window
Now in the window right click on the VC_SEL_OPT view and embed a view like follows:

Application
Now create a web dynpro application and test it, the result must be like follows:

And after click the button Copy:

If you would like more information about select-options see the web dynpro component WDR_TEST_SELECT_OPTIONS in
your SAP system.

tutorial

abap

webdynpro

select-option

component

Contact Us

Follow SCN

SAP Help Portal

Privacy

Terms of Use

Legal Disclosure

Copyright