Skip to Content
Author's profile photo Sankar Gelivi

Select Options in Web Dynpro ABAP — Part 1

Author : Sankar Gelivi

Date    : 05.02.2014

Summary :  This documents explains creation of select options and various methods that are available under the interface IF_WD_SELECT_OPTIONS.

                    This document tells how to create blocks, how to get the range table data etc.

List of methods available in the interface IF_WD_SELECT_OPTIONS:

1.  ADD_SELECTION_FIELD( )

2.  ADD_SELECTION_FIELDS( )

3.  ADD_HORIZONTAL_DIVIDER( )

4.  ADD_TEXT_LINE( )

5.  ADD_BLOCK( )

6.  ADD_PARAMETER_FIELD( )

7.  ADD_SELECTION_SCREEN_ITEMS( )

8.  CREATE_RANGE_TABLE( )

9.  GET_RANGE_TABLE_OF_SEL_FIELD( )

10.SET_GLOBAL_OPTIONS( )

11.RESET_ALL_SELECTION_FIELDS( )

12.GET_SELECTION_FIELDS( )

and so on.

Requirement : Creation of select options in Web Dynpro ABAP using list of methods of the interface IF_WD_SELECT_OPTIONS

Note: 1. SAP has provided a component ‘WDR_SELECT_OPTIONS’ for select options.

Procedure :

1. Define ‘WDR_SELECT_OPTIONS‘ under used components tab of the using or current component.

Screen1.PNG

just like the way we create an instance to the class, we are define component use  ( this will act like a instance ) to the component to the component.

2. Define two attributes in the attributes tab of the view.

screen2.PNG

Note: If you are define select options only in single view of a component then define two attributes in the view controller else define in component controller.

3. Define used controllers in the view controller.

screen3.PNG

4. Click on the CREATE icon and select the INTERFACE CONTROLLER of the WDR_SELECT_OPTIONS

screen4.PNG

5. Component and interface controller of WDR_SELECT_OPTIONS are defined under the view controller’s – used controllers

screen5.PNG

6. Implement the logic in the view controller WDDOINIT( ). This method acts as an initialization.

First instantiate the used component. just like the way we instantiate the classes in ABAP.

click on the F4 of input field and select the component WDR_SELECT_OPTIONS.

screen6.PNGscreen7.PNG

7. Code gets auto generated.

screen8.PNG

8. Implement the following code

screen9.PNG

Note:

wd_this->WD_CPIFC_SELECT( ), is a interface component. This will return all the properties of the WDR_SELECT_OPTIONS component.

9. Define the method CREATE_RANGE_TABLE( ), to create range table for a field.

click on pattern and select call method

screen10.PNG

10. code gets auto generated. define the variables LV_MATNR AND LR_MATNR

screen11.PNG

11. Define the method ADD_SELECTION_SCREE( ), to add field to the selection screen

addselectionscreen.PNG

12. Design the view with the viewcontainer UI element. Viewcontainer UI element acts like a SUB SCREEN Area in Module pool

screen12.PNG

13. Assign View to window. To assign View of the select options, Right click on the VC –> Embed view. screen13.PNG

14. click F4 on the View to be Embedded property and select WND_SELECTION_SCREEN view/Interface view

screen14.PNG

15. View is assigned to View Container

screen15.PNG

16. Create Web Dynpro Application and execute. Select options for Material is displayed.

screen16.PNG

Note: To make four buttons invisible, we have to use the method SET_GLOBAL_OPTIONS( ).

screen17.PNG

17. Active and re-execute the application.

screen18.PNG

Note: 4 standard buttons are now invisible.

———————————————————————————————————————————————————————————————————————————————–

18. ADD_BLOCK( ): To create a block.

Blockcode.PNG

Result :

blockscreen.PNG

———————————————————————————————————————————————————————————————————————————————–

19 .  Create a node in the context.

context material node.PNG

20. Design the view with a Table and Button

clear selection screen.PNG

21. GET_RANGE_TABLE_OF_SEL_FIELD( ): To read the data of select options.

get range table of sel field.PNG

22. Assign LR_MATNR data to a field symbol.

range table.PNG

22. Logic to fetch the data based on the user inputs

fetch the data for single field.PNG

23. Result:

output for single field daa.PNG

———————————————————————————————————————————————————————————————————————————————–

24. ADD_SELECTION_FIELDS( ): To add multiple fields to the selection screen

multiple selection fields.PNG

Result:

multiple selection fields output.PNG

———————————————————————————————————————————————————————————————————————————————–

25. GET_SELECTION_FIELDS( ): To read data of all the selection screen fields.

Method to call all select options.PNG

26. Logic to fetch the data for multiple fields

logic for multiple fields.PNG

Active and execute the application

Note: As the size of the document is exceeding 1 MB, rest of the methods of will be published in a new document as SELECT OPTIONS — Part 2

Assigned tags

      19 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Piyas Kumar Das
      Piyas Kumar Das

      Hi Sankar,

      Nice document but kindly copy past the code using code spinster.

      Regards

      Piyas

      Author's profile photo Sankar Gelivi
      Sankar Gelivi
      Blog Post Author

      Thank you Piyas,

      Thanks & Regards,

      Sankar Gelivi

      Author's profile photo NAVEEN MANDA
      NAVEEN MANDA

      nice document .. .

      In this scenario  my requirement is, material text has to display in bold . like emphazied option ..  how can i achieve dis ?

      Author's profile photo Sankar Gelivi
      Sankar Gelivi
      Blog Post Author

      Hi Naveen, we dont have option to set text as BOLD.

      Thanks & Regards,

      Sankar Gelivi

      Author's profile photo Narasimha Rao
      Narasimha Rao

      Good to share the knowledge. Keep going ahead 🙂

      Author's profile photo Sankar Gelivi
      Sankar Gelivi
      Blog Post Author

      Thank you Narasimha

      Author's profile photo Former Member
      Former Member

      Very descriptive and informative material. Nice job. 🙂

      Author's profile photo Sankar Gelivi
      Sankar Gelivi
      Blog Post Author

      Thank you Amit.

      Author's profile photo Former Member
      Former Member

      Nice document

      Author's profile photo Sankar Gelivi
      Sankar Gelivi
      Blog Post Author

      Thank you Sankar

      Author's profile photo Srikanth Reddy
      Srikanth Reddy

      Thanks for this , It's a great help for me understand this process

      Author's profile photo Sankar Gelivi
      Sankar Gelivi
      Blog Post Author

      Thank you Srikanth

      Author's profile photo prakasareddy konda
      prakasareddy konda

      Helpful document, Thanks for sharing.

      Regards,

      Prakash.

      Author's profile photo siva shankar
      siva shankar

      Thank u very much for this document... Really helpful.

      Author's profile photo Sankar Gelivi
      Sankar Gelivi
      Blog Post Author

      Thank you Siva Shankar

      Author's profile photo Fabio Bellocchio
      Fabio Bellocchio

      Such a helpful and well produced document. Thank you.

      Author's profile photo Sankar Gelivi
      Sankar Gelivi
      Blog Post Author

      Thank you Bellocchio

      Author's profile photo Devendra Patel
      Devendra Patel

      Hi Sankar,
      This page is really helpful can you please provide link to part 2 of this document.

      Author's profile photo Prasanna CD
      Prasanna CD

      Hi

      Helpful, Thanks for Sharing....I want to develop dependent search help using select options.

      Kindly suggest if it is possible.

      Example : Second F4 values should be dependent on first F4.

      Thanks,

      Prasanna CD