Web Dynpro ABAP

Embed Size (px)

DESCRIPTION

Step By Step webdynpro with abap

Citation preview

Web Dynpro ABAPIntroduction

SAP standard UI technologies WDA - Web Dynpro ABAP applications WDJ - Web Dynpro Java applications BSP - Buiness Server Pages applications ITS - HTML pages SAP GUI - Classic dynpro programming model of SAP SAP Interactive forms and print forms by Adobe

SAP Web Dynpro for ABAP and it's advantagesPurpose: Web Dynpro ABAP (WDA) is the main SAP standard UI technology for developing Web application UIs in the ABAP environment. It consists of a runtime environment and a graphical development environment with special tools that are completely integrated into the ABAP development environment - the ABAP Workbench (transaction SE80).

History: WDA has been available since October 2005 (SAP NetWeaver 7.0 (2004s) Web Application Server 7.0) and is widely used by the SAP Business Suite and will continue to be the UI technology of choice for mainstream Business Suite applications (ERP, PLM, SCM, SRM, FIM).FPM is available since WDA 7.00 SP13 and is used by all ERP projects using WDA as of SAP EhP4 for SAP ERP 6.0.

Advantages: The use of declarative and graphical tools significantly reduces the implementationeffort Web Dynpro supports a structured design process Strict separation between layout and business data Reuse and better maintainability by using components The layout and navigation is easily changed using the Web Dynpro tools Stateful applications are supported that is, if the page is changed and the requireddata remains intact so that you can access it at any time throughout the entireapplication context. Note that stateless applications are not possible. Automatic data transport using data binding Automatic input check Automatic operation of the Web Dynpro application using the keyboard User interface accessibility is supported Full integration in the reliable ABAP development environment

SAP Web Dynpro ABAP ArchitectureDefinition: Web Dynpro is the SAP NetWeaver programming model for user interfaces (UIs).The Web Dynpro model is based on the Model View Controller paradigm.Structure: Metamodel Concept Graphical Development Tools Separation of Business and Application Logic Conversion of the Model-View-Controller Programming ModelMVC Prgramming Model: Every Web Dynpro application is structured according to the Model View Controller programming model: The model forms the interface to the back end system and thus enables the Web Dynpro application access to data. The view is responsible for the representation of the data in the browser. The controller lies between the view and the model. The controller formats the model data to be displayed in the view, processes the user entries made by the user, and returns them to the model.

SAP Web Dynpro ABAP tools in Workbench Component editor Controller Editor View Editor Window Editor Web Dynpro Code Wizard Web Dynpro Text browser Web Dynpro ABAP run time analysis SAP Web Dynpro Hook methods and usageMethod NameFunction

Component controller hook methods

WDDOAPPLICATIONSTATECHANGEHandling for Suspending and Resuming an Application

WDDOBEFORENAVIGATIONError Handling Before Navigation Through Application

WDDOEXITController Clean-Up Method

WDDOINITController Initialization Method

WDDOPOSTPROCESSINGPrepare Output

View Controller hook methods

WDDOAFTERACTIONMethod for non-action specific operations before navigation

WDDOBEFOREACTIONMethod for Validation of User Input

WDDOEXITController Clean-Up Method

WDDOINITController Initialization Method

WDDOMODIFYVIEWMethod for Modifying the View Before Rendering

WDDOONCONTEXTMENUMethod for Modifying the Context Menu

Window controller hook methods

WDDOEXITController Clean-Up Method

WDDOINITController Initialization Method

WDDOONCLOSEHandling For Closing of Window

WDDOONOPENHandling For Opening of Window

User Interface

Web Dynpro UI elements and Layout design exampleThe below example program describes

How to design UI elements How to use different Layouts How to use Table UI element How to pass data to UI elements i.e Data binding

Pls Click for detailSAP Web Dynpro ABAP LayoutsThe layout is used to arrange the UI elementss within the parent container.The node ROOTUIELEMENTCONTAINER is the root UI element and all the UI elements within a view are children of this root container. It is of TransparentContainer type and has initially assigned to it the FlowLayout layout.Flow LayoutLeft to right, across the screen

Grid LayoutArranged by number of columns (e.g.colCount = 4)

Matrix LayoutNumber of columns not fixed. Eachelement can be specified for which rowand which column.Need to specify new row items.(MatrixHeadData)

Row LayoutRow by row.Need to specify new row items.(RowHeadData)

Frame Layout

Populate ItemListBox - Web Dynpro ABAPProgram steps Create Web Dynpro Component with Window and View(Automatically View is embedded into Window).

Go to Component Controller COMPONENTCONTROLLER. Context tab->Create COUNTRY node with cardinality 0..n and attributes(refer to T005T structure).

Methods tab->Write the code in WDDOINIT to populate data to show countries as list.

WDDOINIT code METHOD wddoinit . wd_this->get_listbox_data( ). ENDMETHOD.GET_LISTBOX_DATA codeMETHOD get_listbox_data . DATA lo_nd_country TYPE REF TO if_wd_context_node.

DATA lt_country TYPE wd_this->elements_country.

* navigate from to via lead selection lo_nd_country = wd_context->get_child_node( name = wd_this->wdctx_country ). SELECT land1 landx FROM t005t INTO CORRESPONDING FIELDS OF TABLE lt_country WHERE spras = sy-langu. lo_nd_country->bind_table( new_items = lt_country set_initial_elements = abap_true ).ENDMETHOD.

GET_SELECTED_RECS code METHOD get_selected_recs . * "Get selected Elements DATA lo_nd_country TYPE REF TO if_wd_context_node. DATA lt_country TYPE wd_this->elements_country. data: ls_country TYPE wd_this->element_country. data: lt_ctry TYPE wd_this->elements_country. DATA lt_elements TYPE wdr_context_element_set. DATA ls_elements TYPE REF TO if_wd_context_element. "Navigate from to via lead selection lo_nd_country = wd_context->get_child_node( name = wd_this->wdctx_country ). lt_elements = lo_nd_country->get_selected_elements( ). LOOP AT lt_elements INTO ls_elements. ls_elements->get_static_attributes( IMPORTING static_attributes = ls_country ). APPEND ls_country TO lt_ctry. ENDLOOP. "Display selected Elements DATA lo_nd_dsp_coutries TYPE REF TO if_wd_context_node. DATA lt_dsp_coutries TYPE wd_this->elements_dsp_coutries. * navigate from to via lead selection lo_nd_dsp_coutries = wd_context->get_child_node( name = wd_this->wdctx_dsp_coutries ). LOOP AT lt_ctry INTO ls_country. SELECT * FROM t005t APPENDING CORRESPONDING FIELDS OF TABLE lt_dsp_coutries WHERE spras = sy-langu AND land1 = ls_country-land1. ENDLOOP. lo_nd_dsp_coutries->bind_table( new_items = lt_dsp_coutries set_initial_elements = abap_true ). ENDMETHOD. Go to ViewITEMLISTBOX_V Context tab->Map context of Component controller to context of view.

Layout tab->define UI elements 1). ItemListBox 2). Button and OnAction event 3). Table as shown below.

Methods tab->call GET_SELECTED_RECS method from ONACTIONDISPLAY_SELECTED event handler method. METHOD onactiondisplay_selected . DATA lo_componentcontroller TYPE REF TO ig_componentcontroller . lo_componentcontroller = wd_this->get_componentcontroller_ctr( ). lo_componentcontroller->get_selected_recs( ). ENDMETHOD. Activate Web dynpro component Create Web Dynpro application and Save it as local object

Run application.

Web Dynpro ABAP - DropDownByIndex usagePlease follow the steps to fill the Drop Down by Index with values Create Web Dynpro component and Save

Go to View -> Context -> Create node COUNTRIES with cardinality 0..n.

Go to Layout -> Create DropDownByIndex UI element and Label UI element for Drop down box.

Bind the context attribute to DropDown in the shown way.

Go to Methods tab -> WDDOINIT -> Write the below code.

Activate Web Dynpro Component Create Web Dynpro Application

Execute the WebDynrpo application.

SAP Web Dynpro ABAP - DropDownByKey value set settingIf domain is defined with Value Table, drop down list does not get populated with values automatically.Steps to get the values in drop down list (DropDownByKey). Create Web Dynpro component and save as local object.

Go to Context tab -> Create node and attribute inside the node.

Go to Layout tab -> Place UI element DropDownByKey by usingCreate container formso that UI element is automatically bound to Context attribute.

Go to method tab -> Write the below code inWDDOINITmethod. Here we have to callSET_ATTRIBUTE_VALUE_SETof interfaceIF_WD_CONTEXT_NODE_INFOto set the fixed values for an attribute which is bound to DropDownByKey UI element. method wddoinit . "Reference variables data: lo_nd_emp_det type ref to if_wd_context_node, lo_nd_emp_det_info type ref to if_wd_context_node_info, lo_el_emp_det type ref to if_wd_context_element. types: begin of ty_p0002, pernr type pa0002-pernr, nachn type pa0002-nachn, vorna type pa0002-vorna, end of ty_p0002, ty_value_set type wdr_context_attr_value. data: ls_p0002 type ty_p0002, ls_value_set type ty_value_set. data: lt_p0002 type standard table of ty_p0002, lt_value_set type standard table of ty_value_set. "Navigate from to via lead selection lo_nd_emp_det = wd_context->get_child_node( name = wd_this->wdctx_emp_det ). "Get node info lo_nd_emp_det_info = lo_nd_emp_det->get_node_info( ). "Select the all employee details select pernr nachn vorna from pa0002 into table lt_p0002 up to 100 rows. "Put Employee lines into value set loop at lt_p0002 into ls_p0002. ls_value_set-value = ls_p0002-pernr. concatenate ls_p0002-vorna ls_p0002-nachn into ls_value_set-text separated by space. append ls_value_set to lt_value_set. clear ls_value_set. endloop. " Assign value set call method lo_nd_emp_det_info->set_attribute_value_set exporting name = 'PERNR' value_set = lt_value_set. endmethod. Save and Activate Web Dynpro component. Create Web Dynpro Application ->Execute.

SAP Web Dynpro ABAP - Drop down box values using DomainPresently Web Dynpro ABAP engine is fillin Drop down by Key for certain domains, for others not. For domains, that have direct values assigned everything is filled automatically.

If domain has values indirectly through value table, no values are filled.

Steps to get the values in drop down list using Domains Create web dynpro component and save in local directly.

Go to CONTEXT tab insert attribute actio TYPEACTIO or mention the fieldPSPAR-ACTIO directly if the domain is assigned to field.

Go to LAYOUT tab ->Create UI element DropDownbyKey and Bind the context attribute ACTIO to drop down UI element.

If you mention label for drop down box, you should mentionLable forattribute of LABEL UI element.

Save and activate all. Create web dynpro application and execute.

SAP Web Dynpro ABAP - TextEdit UI ElementUsage: You can enter and display multi-line text.

Procedure with steps Create Web Dynpro Component with Window and View(Automatically View is embedded into Window). Go to view ->Context tab Change mode. Ctreate two attributes STR_TAB_01 andSTR_TAB_01of type STRING_TABLE.

Go to view ->Layout tab

Change root UI element ROOTUIELEMENTCONTAINER property LAYOUT =MatrixLayout. Insert TextEdit element(txtedit_4_free_txt_01). Change the element properties COLS = 72 and ROWS = 6.

Bind context attribute str_tab_01 with UI element txtedit_4_free_txt_01.

Insert Button UI element. Change the element property LAYOUT = MatrixHeadData .

Insert TextEdit element(txtedit_4_free_txt_02). Change the element propertiesLAYOUT = MatrixHeadData,COLS = 72 and ROWS = 6.

Bind context attribute str_tab_02 with UI element txtedit_4_free_txt_02.

Create onAction event SUBMIT for Button UI element. Write the below code for Event Handler methodONACTIONSUBMIT. METHOD ONACTIONSUBMIT . DATA LO_EL_CONTEXT TYPE REF TO IF_WD_CONTEXT_ELEMENT. DATA LS_CONTEXT TYPE WD_THIS->ELEMENT_CONTEXT. DATA LV_STR_TAB TYPE WD_THIS->ELEMENT_CONTEXT-STR_TAB. " get element via lead selection LO_EL_CONTEXT = WD_CONTEXT->GET_ELEMENT( ). "get single attribute LO_EL_CONTEXT->GET_ATTRIBUTE( EXPORTING NAME = `STR_TAB` IMPORTING VALUE = LV_STR_TAB ). DATA LT_TLINE TYPE ZTLINE. LT_TLINE = WD_THIS->CONVERT_LGTEXTS( STR_TAB = LV_STR_TAB ). DATA LV_STR_TAB02 TYPE WD_THIS->ELEMENT_CONTEXT-STR_TAB02. " get element via lead selection LO_EL_CONTEXT = WD_CONTEXT->GET_ELEMENT( ). LV_STR_TAB02 = WD_THIS->GET_LGTEXTS( TEXT_TABLE = LT_TLINE ). " set single attribute LO_EL_CONTEXT->SET_ATTRIBUTE( NAME = `STR_TAB02` VALUE = LV_STR_TAB02 ). ENDMETHOD. Method CONVERT_LGTEXTS code.

METHOD CONVERT_LGTEXTS . DATA:LT_STR_TAB TYPE STRING_TABLE, LS_STR TYPE STRING. TYPES: LTY_TDLINE TYPE TLINE-TDLINE, LTY_TLINE TYPE TLINE. DATA: LT_TDLINE TYPE STANDARD TABLE OF LTY_TDLINE. DATA: LS_TDLINE TYPE LTY_TDLINE, LS_TLINE TYPE LTY_TLINE. DATA: LV_TXTSTR TYPE STRING.

CHECK STR_TAB IS NOT INITIAL. LT_STR_TAB = STR_TAB. LOOP AT LT_STR_TAB INTO LS_STR. CLEAR LT_TDLINE[]. LV_TXTSTR = LS_STR. "Convert the string to a table CALL FUNCTION 'CONVERT_STRING_TO_TABLE' EXPORTING I_STRING = LV_TXTSTR I_TABLINE_LENGTH = 72 TABLES ET_TABLE = LT_TDLINE.

LOOP AT LT_TDLINE INTO LS_TDLINE. MOVE LS_TDLINE TO LS_TLINE-TDLINE. APPEND LS_TLINE TO TEXT_TABLE. ENDLOOP. ENDLOOP.ENDMETHOD. Method GET_LGTEXTS code.

METHOD GET_LGTEXTS . TYPES: LTY_TEXT TYPE TLINE-TDLINE, LTY_TLINE TYPE TLINE, LTY_TSTR TYPE STRING. DATA: LT_TEXT TYPE STANDARD TABLE OF LTY_TEXT, LT_TSTR TYPE STANDARD TABLE OF LTY_TSTR. DATA: LS_TEXT TYPE LTY_TEXT, LS_TLINE TYPE LTY_TLINE, LS_TSTR TYPE LTY_TSTR.

LOOP AT TEXT_TABLE INTO LS_TLINE. MOVE LS_TLINE-TDLINE TO LS_TSTR. APPEND LS_TSTR TO LT_TSTR. CLEAR LS_TSTR. ENDLOOP. TEXT_STRING = LT_TSTR.ENDMETHOD. Create Web Dynpro Application. Run application

Web Dynpro ABAP - ViewContainerUIElement usageIf you remember properly sub screen usage in ABAP dialog programming, we canco-relate Web Dynpro ViewContainer UI element to Sub screen. In dialog programming, We create screen as sub screen and we define sub screen area on main screeen. Call subscreen in the main screen.

ViewContainerUIElementis an area within a view that contains another view.UsesView positioning: Flexible design of view assemblies within the browser window.Application performance: The Web Dynpro runtime environment uses the visibility property of the ViewContainerUIElement to reduce the layout data sent to the client. Using the ViewContainerUIElement in this way can improve application performance.

Fundamental principle to use ViewContainerUIElement Create one main View Define View Container area using ViewContainerUIElement Create one more view to embed into View Container Embed second view using Drag and Drop method.Example Create Web Dynpro Component and Save it as local object.

Go to View MAIN_V -> Go to Context tab -> Create node N1 and include few attributes as shown in the screen.

Go to Layout tab ->Change Layout type of ROOTUIELEMENTCONTAINER toMatrixLayout.

Create VIEW_CONTAINER_UIELEMENT ->Change Layout data toMatrixHeadData

Create GROUP element -> Change Layout toGridLayout& Layout Data toMatrixHeadData

Create TextView elements -> Bind with Context node N1 as shown below.

Go to Methods tab -> Write below code in WDDOINIT method. METHOD wddoinit . DATA lo_nd_n1 TYPE REF TO if_wd_context_node. DATA lo_el_n1 TYPE REF TO if_wd_context_element. DATA ls_n1 TYPE wd_this->element_n1. * navigate from to via lead selection lo_nd_n1 = wd_context->get_child_node( name = wd_this->wdctx_n1 ). * get element via lead selection lo_el_n1 = lo_nd_n1->get_element( ). SELECT SINGLE * FROM pa0002 INTO CORRESPONDING FIELDS OF ls_n1. * set all declared attributes lo_el_n1->set_static_attributes( static_attributes = ls_n1 ). ENDMETHOD. Create one more view SEC_V->Create one PAGE_HEADER element.

Embed SEC_V view to into View Container as shown below.

Create Web Dynpro application and save it as local object.

Run Web Dynpro application .

SAP Web Dynpro ABAP - Data in Table displaySteps to achieve Create webdynpro component e.g. ZTEST_WDA_TABLESave. Go to Context tabCreate node e.g. IT0001 with cardinality 0-n.>save. Go to Layout tabDrag and drop Table UI element from UI elements library or right click on ROOTUIELEMENTCONTAINERCreate UI elementGive ID e.g.TAB_DATA and select type TABLESave. Bind Context node with Table UI element. Right click on Table UI element TAB_DATACreate BindingSelect the node from contextContinueSave. Go to Methods tabUse WDDOINIT method to get data and set the data to Context. As context is already bound with Layout table element, at runtime data is display in Layout. Save and activate Webdynpro component. Create Webdynpro application and Run the application. Table is displayed with data in window.

Please Click Here table display

Web Dynpro ABAP - Filtering in Table UI elementSummary.In order to get FILTER or SORTING functions for Table UI element, need to define attribute with ref to IF_WD_TABLE_METHOD_HND interface.

Procedure with steps Create Web Dynpro Component(ZOVH_TABLE_FILTERING_01) with Window and View(Automatically View is embedded into Window).

Go to view ->Context tab Change mode. Create a node IT0001 with cardinality 0-n.

Create another node IT0001_FILTER with cardinality 1-1 and selection 1-1. Attributes of node IT0001 and IT0001_FILTER should be same so that we can provide filter for all attributes.

Take out Dictionary structure.

Take out all attributes of node IT0001_FILTER and replace with STRING type.

Create one attribute IS_FILTER_ON with type WDY_BOOLEAN. This attribute is used to switch on or switch off filter option.

Go to view->Attributes tab. Create one attribute(TABLE_CONTROL) of type IF_WD_TABLE_METHOD_HNDL interface. Interface IF_WD_TABLE_METHOD_HNDL provides sorting and filtering functions for a Table UI element.

Go to view->Layout tab Set Layout =MatrixLayout of ROOTUIELEMENTCONTAINER. Create table UI element(table_4_filter).

Bind context node IT0001 with table UI element. Follow the below steps.

Set filterValue property for each column attribute of table UI element. Similar attribute from node IT0001_FILTER should be mapped to column filterValue property.Follow the steps.

Insert Table Toolbar andToolBarToggleButtonelement into table UI element for filter.

BindCHECKEDproperty ofToolBarToggleButtonelement to attribute IS_FILTER_ON defined at context.

Change the below highlighted portions as specified.

CreateonToggleevent(SWITCH_FILTER) forToolBarToggleButtonelement.

Go to view->Actions tab. Double click onFilterevent.

Past the below code.METHOD ONACTIONFILTER . WD_THIS->TABLE_CONTROL->APPLY_FILTER( ).ENDMETHOD. Go to view->Methods tab. Double click onWDDOMODIFYVIEW method and paste the code.

METHOD WDDOMODIFYVIEW . CASE FIRST_TIME. WHEN ABAP_TRUE. "&---------------------------------------------------------------------* " Code for data retrieval "&---------------------------------------------------------------------* DATA LO_ND_IT0001 TYPE REF TO IF_WD_CONTEXT_NODE. DATA LT_IT0001 TYPE WD_THIS->ELEMENTS_IT0001.

" navigate from to via lead selection LO_ND_IT0001 = WD_CONTEXT->GET_CHILD_NODE( NAME = WD_THIS->WDCTX_IT0001 ).

SELECT * FROM PA0001 INTO CORRESPONDING FIELDS OF TABLE LT_IT0001 UP TO 20 ROWS.

LO_ND_IT0001->BIND_TABLE( NEW_ITEMS = LT_IT0001 SET_INITIAL_ELEMENTS = ABAP_TRUE ). ENDCASE.

"&------------------------------------------------------------------------* " Code for FILTER "&------------------------------------------------------------------------* DATA WD_TABLE TYPE REF TO CL_WD_TABLE. " Name of the table UI element to be provided WD_TABLE ?= VIEW->GET_ELEMENT( 'TABLE_4_FILTER' )."Name of Table UI element WD_THIS->TABLE_CONTROL ?= WD_TABLE->_METHOD_HANDLER.

DATA LO_EL_CONTEXT TYPE REF TO IF_WD_CONTEXT_ELEMENT. DATA LS_CONTEXT TYPE WD_THIS->ELEMENT_CONTEXT. DATA LV_IS_FILTER_ON TYPE WD_THIS->ELEMENT_CONTEXT-IS_FILTER_ON.

" get element via lead selection LO_EL_CONTEXT = WD_CONTEXT->GET_ELEMENT( ). " get single attribute LO_EL_CONTEXT->GET_ATTRIBUTE( EXPORTING NAME = `IS_FILTER_ON` IMPORTING VALUE = LV_IS_FILTER_ON ). " Set or cancel the table's filter action IF LV_IS_FILTER_ON = ABAP_TRUE . WD_TABLE->SET_ON_FILTER( 'FILTER' ). ELSE. WD_TABLE->SET_ON_FILTER( '' ). ENDIF.ENDMETHOD. Save and activate web dynpro component and create web dynpro application. Run web dynpro application.

Click on filter button and filter using any the columns.

SAP Web Dynpro ABAP - Check box on Table display

Simple method. Create webdynpro component e.g. ZOVH_CHKBOX_ON_TABLE_002 Save. Go to Context tab Create node e.g. EMP_ADD with cardinality 0-n. >save

Go to Layout tab Drag and drop Table UI element from UI elements library or right click on ROOTUIELEMENTCONTAINER Create UI element Give ID e.g.TAB_DAT and select type TABLE Save.

Bind Context node with Table UI element. Right click on Table UI element TAB1Create Binding Select the node from context Continue Save.

Go to Methods tabUse WDDOINITSELECT the data and Set the table data to Context METHODwddoinit. DATAlo_nd_emp_addTYPEREFTOif_wd_context_node. DATAlt_emp_addTYPEwd_this->elements_emp_add. "Navigatefromtovialeadselection lo_nd_emp_add=wd_context->get_child_node(name=wd_this->wdctx_emp_add). "Fetchdata SELECT* FROMpa2006 INTOCORRESPONDINGFIELDSOFTABLElt_emp_add UPTO50ROWS. "FindthetablevaluestoContext lo_nd_emp_add->bind_table(new_items=lt_emp_addset_initial_elements=abap_true). ENDMETHOD.

Save and activate Webdynpro component. Create Webdynpro application and Run the application.

Changing existing table for check box. Create webdynpro component e.g. ZOVH_CHKBOX_ON_TABLE Save. Go to Context tab Create node e.g. EMP_ADD with cardinality 0-n. >save Go to Layout tab Drag and drop Table UI element from UI elements library or right click on ROOTUIELEMENTCONTAINER Create UI element Give ID e.g.TAB1 and select type TABLE Save. Bind Context node with Table UI element. Right click on Table UI element TAB1Create Binding Select the node from context Continue Save. Go to context tab again, create one attribute for check box in the node EMP_ADD. Go to Layout tabRight click on Table element Insert table columnInsert Cell editorfor Check boxBind the context CHK1 attribute to Table check box cell. Go to Methods tabUse WDDOINITSELECT the data and Set the table data to Context elements. Save and activate Webdynpro component. Create Webdynpro application and Run the application. Table is displayed with data in window.

Click Heare for details

Web Dynpro ABAP - File Upload - ExcelSteps to achieve Create Web Dynpro Component and Save as local object.

No need to embed View into Window when you specify view and window. Go to Component Controller ->Context tab-> Create two nodes EMP_DET - Cardinality 0..n and FILE with attribute FILE_CONTENTS of type XSTRING.

Go to View UPLOAD_V ->Context tab->Map Component Controller context to View Context as shown below.

Go to Layout tab1. Set ROOTUIELEMENTCONTAINER layout type -MatrixLayout2. Create Group UI element - Layout data - MatrixHeadData

3. Create File Upload UI element inside Group and bind with context node FILE.

4. Create button inside Group - CreateOnActionevent - UPLOAD_FILE

method ONACTIONUPLOAD_FILE . DATA lo_componentcontroller TYPE REF TO ig_componentcontroller . lo_componentcontroller = wd_this->get_componentcontroller_ctr( ). lo_componentcontroller->upload_file( ).

endmethod.5. Create one Table UI element and bind with Context node EMP_DET.

Go to Component Controller -> Method tab -> Write the below code in UPLOAD_FILE.

METHOD upload_file . DATA: lo_nd_file TYPE REF TO if_wd_context_node, lo_nd_emp_det TYPE REF TO if_wd_context_node, lt_emp_det TYPE wd_this->elements_emp_det, lo_el_file TYPE REF TO if_wd_context_element.

DATA: ls_file TYPE wd_this->element_file, ls_emp_det TYPE wd_this->element_emp_det, lt_bin TYPE TABLE OF sdokcntbin, lt_txt TYPE TABLE OF sdokcntasc, ls_txt LIKE LINE OF lt_txt, lv_outlen TYPE i.

* navigate from to via lead selection lo_nd_file = wd_context->get_child_node( name = wd_this->wdctx_file ).

* get element via lead selection lo_el_file = lo_nd_file->get_element( ).

* get all declared attributes lo_el_file->get_static_attributes( IMPORTING static_attributes = ls_file ). "XSTRING to BINARY CALL FUNCTION 'SCMS_XSTRING_TO_BINARY' EXPORTING buffer = ls_file-file_contents IMPORTING output_length = lv_outlen TABLES binary_tab = lt_bin. "Binary to Text file CALL FUNCTION 'SCMS_BINARY_TO_TEXT' EXPORTING input_length = lv_outlen TABLES binary_tab = lt_bin text_tab = lt_txt.

LOOP AT lt_txt INTO ls_txt. SPLIT ls_txt AT cl_abap_char_utilities=>horizontal_tab INTO ls_emp_det-pernr ls_emp_det-nachn ls_emp_det-vorna ls_emp_det-gbdat.

APPEND ls_emp_det TO lt_emp_det. CLEAR ls_emp_det. ENDLOOP.* navigate from to via lead selection lo_nd_emp_det = wd_context->get_child_node( name = wd_this->wdctx_emp_det ). lo_nd_emp_det->bind_table( new_items = lt_emp_det set_initial_elements = abap_true ).

ENDMETHOD.

Create Web Dynpro Application and save it as local object.

Run the application.

Web Dynpro ABAP - Download fileWe use method CL_WD_RUNTIME_SERVICES=>ATTACH_FILE_TO_RESPONSE to download file from Web Dynpro Application.Example to achieve the functionality Create Web Dynpro Component and Save it a local object.

When we specify Window name and View name when we create web dynpro component, View is embedded in Window. Go to Component Controller Context tab->Create node EMP_DET with cardinality 0..n

Method tab->Create GET_DATA method to prepare data for EMP_DET node.

Code METHOD get_data . DATA lo_nd_emp_det TYPE REF TO if_wd_context_node. DATA lt_emp_det TYPE wd_this->elements_emp_det. * navigate from to via lead selection lo_nd_emp_det = wd_context->get_child_node( name = wd_this->wdctx_emp_det ). SELECT * FROM pa0002 INTO CORRESPONDING FIELDS OF TABLE lt_emp_det UP TO 30 ROWS. lo_nd_emp_det->bind_table( new_items = lt_emp_det set_initial_elements = abap_true ). ENDMETHOD. Go to view DOWNLOAD_V. Context tab->Map Component Controller context to View Context.

Layout tab->Change layout property of ROOTUIELEMENTCONTAINER to MatrixLayout. Layout tab->Create Table UI element ->Bind EMP_DET context node to table element->Set Layout data property to MatrixHeadData

Layout tab->Create Button UI element for downloading file-> Create OnAction event DOWNLOAD_DATA for the button.

Code for theONACTIONDOWNLOAD_DATA method.

Code METHOD onactiondownload_data . DATA lo_nd_emp_det TYPE REF TO if_wd_context_node. DATA: lt_emp_det TYPE wd_this->elements_emp_det, ls_emp_det TYPE wd_this->element_emp_det. DATA: str TYPE string, xstr TYPE xstring. * navigate from to via lead selection lo_nd_emp_det = wd_context->get_child_node( name = wd_this->wdctx_emp_det ). lo_nd_emp_det->get_static_attributes_table( IMPORTING table = lt_emp_det ). "Prepare download file. LOOP AT lt_emp_det INTO ls_emp_det. CONCATENATE str ls_emp_det-pernr ls_emp_det-nachn ls_emp_det-vorna ls_emp_det-gbdat cl_abap_char_utilities=>newline INTO str SEPARATED BY cl_abap_char_utilities=>horizontal_tab. ENDLOOP. CALL FUNCTION 'SCMS_STRING_TO_XSTRING' EXPORTING text = str IMPORTING buffer = xstr EXCEPTIONS failed = 1. "Attach file CALL METHOD cl_wd_runtime_services=>attach_file_to_response EXPORTING i_filename = 'Download.xls' i_content = xstr i_mime_type = 'EXCEL' i_in_new_window = abap_false i_inplace = abap_false. ENDMETHOD. Methods tab->Call GET_DATA method in WDDOINIT method to get EMP_DET node elements to display in Table.

method WDDOINIT . DATA lo_componentcontroller TYPE REF TO ig_componentcontroller . lo_componentcontroller = wd_this->get_componentcontroller_ctr( ).

lo_componentcontroller->get_data( ).

endmethod. Save and Activate Web Dynpro component. Create Web Dynpro Application and Save it as local object.

Run Web Dynpro Application.

Message Handling

Web Dynpro ABAP - Message handlingWe use MESSAGE statement to show error, warning or Information message to the user. But when it comes to Web Dynpro ABAP, we useIF_WD_MESSAGE_MANAGER interface as message manager for messages integration, we can access that in the Web Dynpro code wizard.The below are the important methods in the interface.

MethodDescription

REPORT_EXCEPTIONReports a Web Dynpro Exception (May Return)

REPORT_SUCCESSReports a Success Message

REPORT_WARNINGReports a Warning

REPORT_ERROR_MESSAGEReports a Web Dynpro Message with Optional Parameters

REPORT_MESSAGEReports a message

REPORT_T100_MESSAGEReports a Message Using a T100 Entry

REPORT_FATAL_EXCEPTIONReports a Fatal Web Dynpro Exception

REPORT_FATAL_ERROR_MESSAGEReports a Fatal WD Exception Message w/ Optional Parameters

REPORT_ATTRIBUTE_ERROR_MESSAGEReports a WD Exception for a Context Attribute

REPORT_ATTRIBUTE_EXCEPTIONReports a WD Exception for a Context Attribute

REPORT_ATTRIBUTE_T100_MESSAGEReports a WD Exception for a Context Attribute

REPORT_ELEMENT_ERROR_MESSAGEReports a Web Dynpro exception related to context attributes

REPORT_ATTRIBUTE_MESSAGEReports a message for this context attribute

REPORT_ELEMENT_EXCEPTIONReports a Web Dynpro exception related to context attributes

REPORT_ELEMENT_T100_MESSAGEReports a Web Dynpro exception related to context attributes

IS_EMPTYQuery Whether Messages Exist

CLEAR_MESSAGESDelete All Messages

HAS_VAL_ERRORS_FOR_WINDOWQuery whether there are validation messages for a window

REMOVE_MESSAGEDeletes an individual message

GET_MESSAGESReturns all messages

HAS_VALIDATION_ERRORSQuery whether there are validation messages

GET_MESSAGE_FOR_IDReturns the message for a MESSAGE_ID

Web dynpro abap Error / Success message sample programIn the previous postWeb Dynpro ABAP - Message handling, discussed about IF_WD_MESSAGE_MANAGER and its methods. Here we use two methods to show Success and Error message.Fundamental principle of displaying any message in Web Dynpro We define MESSAGE_AREA Ui element on view. Define reference to IF_WD_MESSGE_MANAGER Call method REPORT_SUCCESS and pass text to show success message. Call method REPORT_ERROR_MESSAGE and pass text to show error message. Message Manager will display the message on view in the Message area.Example program Create Web Dynpro component and Save as local object.

Go to view -> Context tab -> Create node N1 and ADDRESS_TYPE inside the node.

Go to layout --> Place Input field and bind with context attribute. ---------------> Place one button ---------------> Place Message Area where you want to display messages.

CreateOnActionevent for Button write code as shown below.

Code for SHOW_MESSAGE action event

METHOD onactionshow_message .* Context related declaration DATA: lo_nd_n1 TYPE REF TO if_wd_context_node, lo_el_n1 TYPE REF TO if_wd_context_element, ls_n1 TYPE wd_this->element_n1.* get message manager DATA: lo_api_controller TYPE REF TO if_wd_controller, lo_message_manager TYPE REF TO if_wd_message_manager.* Structure and variables DATA: ls_t591s TYPE t591s, lv_msg TYPE string.

* navigate from to via lead selection lo_nd_n1 = wd_context->get_child_node( name = wd_this->wdctx_n1 ).

* get element via lead selection lo_el_n1 = lo_nd_n1->get_element( ).

* get all declared attributes lo_el_n1->get_static_attributes( IMPORTING static_attributes = ls_n1 ). SELECT SINGLE * FROM t591s INTO ls_t591s WHERE sprsl = sy-langu AND infty = '0006' AND subty = ls_n1-address_type. IF sy-subrc EQ 0. "Success message display lo_api_controller ?= wd_this->wd_get_api( ). CALL METHOD lo_api_controller->get_message_manager RECEIVING message_manager = lo_message_manager. CONCATENATE 'Selected addrees is:' ls_t591s-stext INTO lv_msg SEPARATED BY space.* report message CALL METHOD lo_message_manager->report_success EXPORTING message_text = lv_msg.

ELSE. "Error message display lo_api_controller ?= wd_this->wd_get_api( ). CALL METHOD lo_api_controller->get_message_manager RECEIVING message_manager = lo_message_manager.* report message CALL METHOD lo_message_manager->report_error_message EXPORTING message_text = 'Please enter correct address type'.

ENDIF.ENDMETHOD. Create Web Dynpro Application and save.

Execute the Web Dynpro application.

Integration

Web Dynpro ABAP - ALV Sample programTo provide the data we want to display in the ALV output, perform the following three steps: Internal data table- We provide an internal data table. Context node- We provide a suitable context node and attributes in the context of your application. Transfer data to the ALV component- We provide this context node for the ALV component.External Context MappingExternal mapping is a cross-component mapping and can be directly mapping or reversely mapping. We can create an external context mapping if we have firstly declared a usage for the component that holds the respective context and the respective context node has been marked as interface.

Concept of the example program.1. ->Input - Employee number2. ->Prepare Address data into itab to be displayed in ALV3. ->Suitable Context node to be mapped to ALV DATA node.4. ->Output is through ALV TABLE view.5. ->We include ALV TABLE view into VIEW_CONTAINER_ELEMENT of our view.Steps to display data in ALV output Create Web Dynpro Component and Save as Local Object

Double click on COMPONENTCONTROLLER->Under Used Components tab ->Define Component Use as ALV and Component type SALV_WD_TABLE.

Save and Activate Web Dynpro Component.

Define Component Controller Context ->Two nodes 1). INPUT - PERNR attribute to get input 2). OUTPUT - ADDRESS node with cardinality 0..n to display internal table data in ALV.

Map Component Controller context INPUT node to View Context.

Go to Layout -> Change ROOTUIELEMENTCONTAINER layout type to MatrixLayout. Place GROUP ui element - Layout type MatrixData ->Create UI element for Input field and bind Context element to input field -> Create Button to search employees address details.

Go to COMPONENTCONTROLLER -> Methods Tab ->Create EMP_ADD_DATA method->Double click on method and generate the code as shown below.

METHOD get_emp_add . DATA lo_nd_output TYPE REF TO if_wd_context_node. DATA lt_output TYPE wd_this->elements_output. DATA lo_nd_input TYPE REF TO if_wd_context_node. DATA lo_el_input TYPE REF TO if_wd_context_element. DATA ls_input TYPE wd_this->element_input.

* navigate from to via lead selection lo_nd_input = wd_context->get_child_node( name = wd_this->wdctx_input ).

* get element via lead selection lo_el_input = lo_nd_input->get_element( ).

* get all declared attributes lo_el_input->get_static_attributes( IMPORTING static_attributes = ls_input ). SELECT * FROM pa0006 INTO CORRESPONDING FIELDS OF TABLE lt_output WHERE pernr EQ ls_input-pernr.* navigate from to via lead selection lo_nd_output = wd_context->get_child_node( name = wd_this->wdctx_output ). lo_nd_output->bind_table( new_items = lt_output set_initial_elements = abap_true ).

ENDMETHOD. Go to view ->Layout tab-> Double click on button ->Create event GET_EMP_ADDRESS ->Generate the code as shown below.

METHOD onactionget_emp_address . DATA lo_componentcontroller TYPE REF TO ig_componentcontroller .

lo_componentcontroller = wd_this->get_componentcontroller_ctr( ). lo_componentcontroller->get_emp_add( ).

ENDMETHOD. Go to View -> Layout tab -> Create VIEW_CONTAINER_ELEMENT ui element and set Layout data property to MatrixHeadData -> Save.

Double click on INTERFACECONTROLLER_USAGE and Click on Controller Usage button and follow as shown in the screen.

Map OUTPUT node of COMPONENTCONTROLLER context with ALV Context DATA node. This is called reversal mapping or External mapping .

Go to Window ->Embed the TABLE view of Component SALV_WD_TABLE into VIEW_CONTAINER_ELEMENT. Please follow the print screen steps.

Activate Web Dynpro component. Create Web Dynpro Application and Save

Run Web Dynpro Application and output as follows.

Column editing in ALV - Web Dynpro ABAPThe ALV output is read-only by default. To allow users to change or enter new data then you have to makesome changes to the standard settings.Procedure The write-protection for the ALV output must be deactivated before these actions can be executed.lv_value->IF_SALV_WD_TABLE_SETTINGS~SET_READ_ONLY( ABAP_FALSE ). The ALV output uses TextView as the cell editor for displaying data by default. To make it possiblefor users to enter or change existing data, replace this interface element with an interactive interfaceelement, such asInputField. LOOP AT lt_column INTO ls_column. CASE ls_column-id. WHEN 'STRAS'. CREATE OBJECT lr_input_field EXPORTING value_fieldname = ls_column-id. ls_column-r_column->set_cell_editor( lr_input_field ). ENDCASE. The user can add rows at a specific position, attach them to the end of the ALV output, and delete them. It is also possible to attach a whole page of empty rows, not only individual rows, to make it possible to enter mass data. You must also define the time at which the system checks whether changed data is correct. If the user changes or creates new data then it might be necessary to refresh the data manually oryou might only want to refresh that data and not the whole ALV output.Program with steps Create Web Dynpro Component with Window and View(Automatically View is embedded into Window).

Define Component Use ALV for the Used component SALV_WD_TABLE under Used Components tab of Web Dynpro Component.

Go to Component Controller COMPONENTCONTROLLER Properties tab->Define or Include Used Controllers/ Components of ALV.

Context tab->Create PA0006 node with cardinality 0..n.

Methods tab->Write the code in WDDOINIT to populate data in ALV.

WDDOINIT method codeMETHOD wddoinit . "Get data wd_this->get_data( ).ENDMETHOD. GET_DATA method code.method get_data .

data lo_nd_pa0006 type ref to if_wd_context_node. data lt_pa0006 type wd_this->elements_pa0006. "Navigate from to via lead selection lo_nd_pa0006 = wd_context->get_child_node( name = wd_this->wdctx_pa0006 ). "Get data select * from pa0006 into corresponding fields of table lt_pa0006 up to 10 rows where stras ne space.

lo_nd_pa0006->bind_table( new_items = lt_pa0006 set_initial_elements = abap_true ).

endmethod. CHANGE_ALV_CONFIG method to change ALV configuration and make ALV table cell editable. This method would be called from view CELL_EDIT_V hook method WDDOINIT.METHOD change_alv_config . "Create an instance of ALV component DATA lo_cmp_usage TYPE REF TO if_wd_component_usage. lo_cmp_usage = wd_this->wd_cpuse_alv( ). "If not initialized, then initialize IF lo_cmp_usage->has_active_component( ) IS INITIAL. lo_cmp_usage->create_component( ). ENDIF. "Create an instance of ALV Interface Controller DATA lo_interfacecontroller TYPE REF TO iwci_salv_wd_table . lo_interfacecontroller = wd_this->wd_cpifc_alv( ). "Configuration of the ALV Output DATA lv_value TYPE REF TO cl_salv_wd_config_table. lv_value = lo_interfacecontroller->get_model( ).

DATA: lr_column_settings TYPE REF TO if_salv_wd_column_settings, lr_input_field TYPE REF TO cl_salv_wd_uie_input_field. DATA: lt_column TYPE salv_wd_t_column_ref, ls_column TYPE salv_wd_s_column_ref.

"Casting lr_column_settings ?= lv_value. "Get columns lt_column = lr_column_settings->get_columns( ). LOOP AT lt_column INTO ls_column. CASE ls_column-id. WHEN 'STRAS'. CREATE OBJECT lr_input_field EXPORTING value_fieldname = ls_column-id. ls_column-r_column->set_cell_editor( lr_input_field ). ENDCASE. ENDLOOP. "Set read only mode to false (and display edit toolbar) DATA: lr_table_settings TYPE REF TO if_salv_wd_table_settings. lr_table_settings ?= lv_value. lr_table_settings->set_read_only( abap_false ).

ENDMETHOD. Go to view CELL_EDIT_V -Layout tab->Create View Container UI element to display ALV output.

Methods tab->WDDOINIT method.method WDDOINIT . DATA: lo_componentcontroller TYPE REF TO ig_componentcontroller . lo_componentcontroller = wd_this->get_componentcontroller_ctr( ). lo_componentcontroller->change_alv_config( ).

endmethod. Go to INTERFACECONTROLLER_USAGE of ALV->Map Context node PA0006 of component controller to DATA of ALV Interface Controller.

Go to window CELL_EDIT_W->Embed TABLE view of SALV_WD_TABLE component in window as shown in the screen.

Activate Web Dynpro component. Create Web Dynpro Application and Save it as local object.

Run web dynpro application.

Web Dynpro ABAP - ALV Total and SubtotalALV Output in External View with ALV Configuration Model

1. Create Context node in component controller. If necessary, map the component controller context to view Context.2. Define a component usage for ALV component SALV_WD_TABLE in web dynpro component. In doing so, we specify a name for the component usage (for example, ALV_COMPONENT).3. Define the usage of this component in the properties for your view. Since we need the object model for our changes, choose the With Controller Access variant (component interface).4. Using external context mapping, we provide the DATA context node in the ALV interface controller with our application context node.5. Generate the UI element ViewContainerUIElement at the required position in the layout of view.6. We have already embedded our view in the window of your application. The name of the UI element ViewContainerUIElement that we prepared in the previous step for the ALV output is displayed beneath this view. Under this entry, we then embed the TABLE view for the SALV_WD_TABLE ALV component.7. To configure the ALV output, we must follow two additional steps: Instantiate the used ALV component in a method of your view (for example, WDDOINIT). Get the ALV configuration model and with it the object model, field objects, and column objects.Example Program with steps Create Web Dynpro component and Save it as local object.

Define component usage for SALV_WD_TABLE in web dynpro component and Specify the name of component usage - ALV_COMPONENT.

Go to Component Controller ->Context tab ->Create node ALV_TAB with cardinality 0..n. as shown below.

Component controller ->Methods tab ->Create method -GET_DATA ->Write code to get the records or elements for ALV_TAB node.

GET_DATA method codeMETHOD get_data . DATA: lo_nd_alv_tab TYPE REF TO if_wd_context_node, lt_alv_tab TYPE wd_this->elements_alv_tab.

* navigate from to via lead selection lo_nd_alv_tab = wd_context->get_child_node( name = wd_this->wdctx_alv_tab ). "Get employees information from PA0008 SELECT * FROM pa0008 INTO CORRESPONDING FIELDS OF TABLE lt_alv_tab. lo_nd_alv_tab->bind_table( new_items = lt_alv_tab set_initial_elements = abap_true ).

ENDMETHOD.

Go to view ALV_V -> Layout tab -> Create View Container UI element VIEWCONTAINER as shown below.

Go to ALV Interface Controller ->Map our Component Controller Context node ALV_TAB with ALV context node DATA. This is called External Context Mapping.

When we create Web Dynpro component with Window and View, view is automatically embedded. We need to embed TABLE view of SALV_WD_TABLE component in VIWCONTAINER created in View ALV_V.

Create Web Dynpro Application and Save it as local object .

Run Web Dynpro application.

Creating Totals and Sub totals Define the usage of ALV component ALV_COMPONENT in the properties for your view. Since we need the object model for our changes, choose the With Controller Access variant (component interface). Go to view ALV_V -> Methods tab ->Create GET_TOTAL(Write the code for creating subtotal of Annual Salary(ANSAL)->Call that method in WDDOINIT. Steps in GET_TOTAL method.1. Getting the instance of ALV Component and Interface Controller.2. Getting all columns3. Looping at columns and declaring aggregation rule for ANSAL & DIVGV column.4. For creating subtotal based on TRFGB(Pay Scale Area), Create a sort rule for TRFGB. GET_TOTAL method code "Create instance for ALV Component usage. DATA lo_cmp_usage TYPE REF TO if_wd_component_usage.

lo_cmp_usage = wd_this->wd_cpuse_alv_component( ). IF lo_cmp_usage->has_active_component( ) IS INITIAL. lo_cmp_usage->create_component( ). ENDIF. "Get config model DATA lo_interfacecontroller TYPE REF TO iwci_salv_wd_table . lo_interfacecontroller = wd_this->wd_cpifc_alv_component( ). DATA lr_config_table TYPE REF TO cl_salv_wd_config_table. lr_config_table = lo_interfacecontroller->get_model( ). "Total DATA:lr_field_amnt TYPE REF TO cl_salv_wd_field. lr_field_amnt = lr_config_table->if_salv_wd_field_settings~get_field( fieldname = 'ANSAL' ). lr_field_amnt->if_salv_wd_aggr~create_aggr_rule( aggregation_type = IF_SALV_WD_C_AGGREGATION=>AGGRTYPE_TOTAL ).

DATA:lr_field_hrs TYPE REF TO cl_salv_wd_field. lr_field_hrs = lr_config_table->if_salv_wd_field_settings~get_field( fieldname = 'DIVGV' ). lr_field_hrs->if_salv_wd_aggr~create_aggr_rule( aggregation_type = IF_SALV_WD_C_AGGREGATION=>AGGRTYPE_TOTAL ). "Sub total based on Payscale area DATA:lr_field_trfgb TYPE REF TO cl_salv_wd_field. lr_field_trfgb = lr_config_table->if_salv_wd_field_settings~get_field( fieldname = 'TRFGB' ). lr_field_trfgb->if_salv_wd_sort~create_sort_rule( sort_order = IF_SALV_WD_C_SORT=>SORT_ORDER_ASCENDING group_aggregation = abap_true ).METHOD get_total . DATA: lo_cmp_usage TYPE REF TO if_wd_component_usage, lo_interfacecontroller TYPE REF TO iwci_salv_wd_table, lr_config_table TYPE REF TO cl_salv_wd_config_table, lr_column_settings TYPE REF TO if_salv_wd_column_settings, lr_field_settings TYPE REF TO if_salv_wd_field_settings, lr_aggr_rule TYPE REF TO cl_salv_wd_aggr_rule, lr_sort_rule TYPE REF TO cl_salv_wd_sort_rule. DATA: lr_column TYPE REF TO cl_salv_wd_column, lr_field_amnt TYPE REF TO cl_salv_wd_field, lr_field_hrs TYPE REF TO cl_salv_wd_field, lr_field_trfgb TYPE REF TO cl_salv_wd_field. DATA: lt_column TYPE salv_wd_t_column_ref, ls_column TYPE salv_wd_s_column_ref.

"Create an instance of ALV component lo_cmp_usage = wd_this->wd_cpuse_alv_component( ). "If not initialized, then initialize IF lo_cmp_usage->has_active_component( ) IS INITIAL. lo_cmp_usage->create_component( ). ENDIF. "Create an instance of ALV Interface Controller lo_interfacecontroller = wd_this->wd_cpifc_alv_component( ). "Configuration of the ALV Output lr_config_table = lo_interfacecontroller->get_model( ). "Casting lr_column_settings ?= lr_config_table. "Get columns lt_column = lr_column_settings->get_columns( ).

LOOP AT lt_column INTO ls_column. CASE ls_column-id. WHEN 'ANSAL'. CALL METHOD lr_config_table->if_salv_wd_field_settings~get_field EXPORTING fieldname = 'ANSAL' RECEIVING value = lr_field_amnt. " Create aggregate rule as total CALL METHOD lr_field_amnt->if_salv_wd_aggr~create_aggr_rule EXPORTING aggregation_type = if_salv_wd_c_aggregation=>aggrtype_total RECEIVING value = lr_aggr_rule. WHEN 'DIVGV'. CALL METHOD lr_config_table->if_salv_wd_field_settings~get_field EXPORTING fieldname = 'DIVGV' RECEIVING value = lr_field_hrs. " Create aggregate rule as total CALL METHOD lr_field_hrs->if_salv_wd_aggr~create_aggr_rule EXPORTING aggregation_type = if_salv_wd_c_aggregation=>aggrtype_total RECEIVING value = lr_aggr_rule. WHEN 'TRFGB'. CALL METHOD lr_config_table->if_salv_wd_field_settings~get_field EXPORTING fieldname = 'TRFGB' RECEIVING value = lr_field_trfgb. " Sub totals based on contract currency. CALL METHOD lr_field_trfgb->if_salv_wd_sort~create_sort_rule EXPORTING sort_order = if_salv_wd_c_sort=>sort_order_ascending group_aggregation = abap_true RECEIVING value = lr_sort_rule. ENDCASE. ENDLOOP.

ENDMETHOD. Save and Activate the Web Dynpro Component Run the Application again.

TOP OF LIST in ALV - Web Dynpro ABAP Create Web Dynpro Component with Window and View(Automatically View is embedded into Window).

Define Component Use ALV for the Used component SALV_WD_TABLE under Used Components tab of Web Dynpro Component.

Go to Component Controller COMPONENTCONTROLLER Properties tab->Define or Include Used Controllers/ Components of ALV.

Context tab->Create PA0002 node with cardinality 0..n.

Context tab->Create TOP_OF_LIST node with attribute CONTENT (type ref to CL_SALV_FORM_ELEMENT)

Context tab-> Map node TOP_OF_LIST of ALV Component context to TOP_OF_LIST of Component Controller.

Methods tab->Write the code in WDDOINIT to populate data in ALV and creating TOP_OF_LIST.

WDDOINIT method codeMETHOD wddoinit .

wd_this->get_pa0002_data( ). wd_this->create_top_of_list( ).

ENDMETHOD. GET_PA0002_DATA codeMETHOD get_pa0002_data . DATA lo_nd_pa0002 TYPE REF TO if_wd_context_node. DATA lt_pa0002 TYPE wd_this->elements_pa0002.

"Navigate from to via lead selection lo_nd_pa0002 = wd_context->get_child_node( name = wd_this->wdctx_pa0002 ). SELECT * FROM pa0002 INTO CORRESPONDING FIELDS OF TABLE lt_pa0002 UP TO 20 ROWS. lo_nd_pa0002->bind_table( new_items = lt_pa0002 set_initial_elements = abap_true ).

ENDMETHOD. CREATE_TOP_OF_LIST codeMETHOD create_top_of_list. DATA lo_nd_top_of_list TYPE REF TO if_wd_context_node. DATA lo_el_top_of_list TYPE REF TO if_wd_context_element. DATA ls_top_of_list TYPE wd_this->element_top_of_list. DATA:lr_grid TYPE REF TO cl_salv_form_layout_grid.* TOP-OF-LIST**...create top grid CREATE OBJECT lr_grid EXPORTING columns = 5.

*... fill 1. row lr_grid->create_text( EXPORTING row = 1 column = 1 rowspan = 1 colspan = 1 text = 'Cell 1,1' ).

lr_grid->create_text( EXPORTING row = 1 column = 2 rowspan = 1 colspan = 1 text = 'Cell 1,2' ).

lr_grid->create_text( EXPORTING row = 1 column = 3 rowspan = 1 colspan = 1 text = 'Cell 1,3' ).

lr_grid->create_text( EXPORTING row = 1 column = 4 rowspan = 1 colspan = 1 text = 'Cell 1,4' ).

lr_grid->create_text(EXPORTING row = 1 column = 5 rowspan = 1 colspan = 1 text = 'Cell 1,5' ).*...fill 2nd row lr_grid->create_text( EXPORTING row = 2 column = 1 rowspan = 1 colspan = 1 text = 'Cell 2,1' ).

lr_grid->create_text( EXPORTING row = 2 column = 2 rowspan = 1 colspan = 1 text = 'Cell 2,2' ).

lr_grid->create_text( EXPORTING row = 2 column = 3 rowspan = 1 colspan = 1 text = 'Cell 2,3' ).

lr_grid->create_text( EXPORTING row = 2 column = 4 rowspan = 1 colspan = 1 text = 'Cell 2,4' ).

lr_grid->create_text(EXPORTING row = 2 column = 5 rowspan = 1 colspan = 1 text = 'Cell 2,5' ). "Navigate from to via lead selection lo_nd_top_of_list = wd_context->get_child_node( name = wd_this->wdctx_top_of_list ).

"pass TOL to context node lo_nd_top_of_list = wd_context->get_child_node( name = 'TOP_OF_LIST' ). lo_el_top_of_list = lo_nd_top_of_list->get_element( index = 1 ).

CALL METHOD lo_el_top_of_list->set_attribute EXPORTING value = lr_grid name = 'CONTENT'.

ENDMETHOD. Go to INTERFACECONTROLLER_USAGE of ALV->Map Context node PA0002 of component controller to DATAof ALV Interface Controller.

Go to window ALV_TOL_W->Embed TABLE view of SALV_WD_TABLE component in window as shown in the screen.

Activate Web Dynpro component. Create Web Dynpro Application and save it as local object.

Run the web dynpro application

Go to Component Controller COMPONENTCONTROLLER Context tab->Create END_OF_LIST node with attribute CONTENT (type ref to CL_SALV_FORM_ELEMENT).

Context tab-> Map node END_OF_LIST of ALV Component context to END_OF_LIST of Component Controller.

Methods tab->Write the code in WDDOINIT to populate data in ALV and creating TOP_OF_LIST and END_OF_LIST events.

WDDOINIT method codemethod wddoinit.

wd_this->get_pa0002_data( ). wd_this->create_top_of_list( ). wd_this->create_end_of_list( ).

endmethod. CREATE_END_OF_LIST codemethod create_end_of_list . data lo_nd_top_of_list type ref to if_wd_context_node. data lo_el_top_of_list type ref to if_wd_context_element. data ls_top_of_list type wd_this->element_top_of_list. data:lr_grid type ref to cl_salv_form_layout_grid.* TOP-OF-LIST**...create top grid create object lr_grid exporting columns = 5.

*... fill 1. row lr_grid->create_text( exporting row = 1 column = 1 rowspan = 1 colspan = 1 text = 'Cell 1,1' ).

lr_grid->create_text( exporting row = 1 column = 2 rowspan = 1 colspan = 1 text = 'Cell 1,2' ).

lr_grid->create_text( exporting row = 1 column = 3 rowspan = 1 colspan = 1 text = 'Cell 1,3' ).

lr_grid->create_text( exporting row = 1 column = 4 rowspan = 1 colspan = 1 text = 'Cell 1,4' ).

lr_grid->create_text(exporting row = 1 column = 5 rowspan = 1 colspan = 1 text = 'Cell 1,5' ).*...fill 2nd row lr_grid->create_text( exporting row = 2 column = 1 rowspan = 1 colspan = 1 text = 'Cell 2,1' ).

lr_grid->create_text( exporting row = 2 column = 2 rowspan = 1 colspan = 1 text = 'Cell 2,2' ).

lr_grid->create_text( exporting row = 2 column = 3 rowspan = 1 colspan = 1 text = 'Cell 2,3' ).

lr_grid->create_text( exporting row = 2 column = 4 rowspan = 1 colspan = 1 text = 'Cell 2,4' ).

lr_grid->create_text(exporting row = 2 column = 5 rowspan = 1 colspan = 1 text = 'Cell 2,5' ). "Navigate from to via lead selection lo_nd_top_of_list = wd_context->get_child_node( name = wd_this->wdctx_top_of_list ).

"pass TOL to context node lo_nd_top_of_list = wd_context->get_child_node( name = 'END_OF_LIST' ). lo_el_top_of_list = lo_nd_top_of_list->get_element( index = 1 ).

call method lo_el_top_of_list->set_attribute exporting value = lr_grid name = 'CONTENT'.

endmethod. Activate Web Dynpro Component. Run Web Dynpro Application.

Web Dynpro ABAP ALV - ON_CLICK eventThe following example program is a step by step guide to use ON_CLICK event touser actions for the Button UI element.Procedure. Create Web dynpro alv program by using ALV component SALV_WD_TABLE. Configure the ALV to get button for column Define one event handler method ON_CLICKin view controller for ON_CLICK event of SALV_WD_TABLE interface controller. Identify Click in a Cell of ALV Output in event handler method ON_CLICK. Implement WDDOMODIFYVIEW to set data based on click in a Cell.Program steps Create One Web Dynpro application for ALV output.Click here to check on how to create. Go to Component controller of web dynpro component Methods tab ->Define CONFIGURE_ALV method and write the code as specified.

CONFIGURE_ALV method code METHOD configure_alv . "Instantiate Used Component DATA lo_cmp_usage TYPE REF TO if_wd_component_usage. lo_cmp_usage = wd_this->wd_cpuse_alv( ). IF lo_cmp_usage->has_active_component( ) IS INITIAL. lo_cmp_usage->create_component( ). ENDIF. "Create an instance of ALV Interface Controller DATA lo_interfacecontroller TYPE REF TO iwci_salv_wd_table . lo_interfacecontroller = wd_this->wd_cpifc_alv( ). "Configuration of the ALV Output DATA lv_value TYPE REF TO cl_salv_wd_config_table. lv_value = lo_interfacecontroller->get_model( ). DATA: lr_column_settings TYPE REF TO if_salv_wd_column_settings, lt_columns TYPE salv_wd_t_column_ref, ls_columns LIKE LINE OF lt_columns. lr_column_settings ?= lv_value. lt_columns = lr_column_settings->get_columns( ). LOOP AT lt_columns INTO ls_columns. CASE ls_columns-id. WHEN 'PERNR'. DATA:lr_button TYPE REF TO cl_salv_wd_uie_button. CREATE OBJECT lr_button. lr_button->set_text_fieldname( ls_columns-id ). ls_columns-r_column->set_cell_editor( lr_button ). ENDCASE. ENDLOOP. ENDMETHOD. "configure_alv Call CONFIGURE_ALV method in WDDOINIT hook method. METHOD wddoinit . wd_this->get_data( ). wd_this->configure_alv( ). ENDMETHOD. Activate web dynpro component and run application. The output would be like below.

Go to view ALV_EVENTS_V Properties tab->Define or Include Used Controllers/ Components of ALV.

Context tab->Create node PA0006 with cardinality 0..n and another node EVENT_PROPERTIES(beneath NAME and VALUE areattributes)with cardinality 0..n. Context node EVENT_PROPERTIESis needed to hold the information on the last event.

Layout tab->Create one table UI element->Bind Context node PA0006 with table UI element.

Method tab->Define ON_CLICK event handler method for ON_CLICK event of ALV Interface controller.

ON_CLICK event handler method code.Here EVENT_PROPERTIES context node will be populated with details like column id, column index, column attributes and value of column. Bind the internal table to context node EVENT_PROPERTIES. METHOD ON_CLICK . DATA: lr_node TYPE REF TO if_wd_context_node, lt_event_properties TYPE wd_this->elements_event_properties, ls_event_properties TYPE wd_this->element_event_properties. FIELD-SYMBOLS: TYPE ANY. * fill internal table ls_event_properties-name = 'COLUMN_ID'. ls_event_properties-value = r_param->column. APPEND ls_event_properties TO lt_event_properties. ls_event_properties-name = 'INDEX'. ls_event_properties-value = r_param->index. APPEND ls_event_properties TO lt_event_properties. ls_event_properties-name = 'ATTRIBUTE'. ls_event_properties-value = r_param->attribute. APPEND ls_event_properties TO lt_event_properties. ASSIGN r_param->value->* TO . ls_event_properties-name = 'VALUE'. ls_event_properties-value = . APPEND ls_event_properties TO lt_event_properties. * navigate to context node EVENT_PROPERTIES lr_node = wd_context->get_child_node( 'EVENT_PROPERTIES' ). * bind internal table to context node lr_node->bind_table( lt_event_properties ). ENDMETHOD. Populate context node PA0006 based on context EVENT_PROPERTIES. For that useWDDOMODIFYVIEW hook method. WDDOMODIFYVIEW method code METHOD wddomodifyview . DATA lo_nd_event_properties TYPE REF TO if_wd_context_node. DATA: lt_event_properties TYPE wd_this->elements_event_properties, ls_event_properties LIKE LINE OF lt_event_properties. " Navigate from to via lead selection lo_nd_event_properties = wd_context->get_child_node( name = wd_this->wdctx_event_properties ). lo_nd_event_properties->get_static_attributes_table( IMPORTING table = lt_event_properties ). DATA lo_nd_pa0006 TYPE REF TO if_wd_context_node. DATA lt_pa0006 TYPE wd_this->elements_pa0006. " Navigate from to via lead selection lo_nd_pa0006 = wd_context->get_child_node( name = wd_this->wdctx_pa0006 ). READ TABLE lt_event_properties INTO ls_event_properties WITH KEY name = 'VALUE'. SELECT * FROM pa0006 INTO CORRESPONDING FIELDS OF TABLE lt_pa0006 WHERE pernr EQ ls_event_properties-value. lo_nd_pa0006->bind_table( new_items = lt_pa0006 set_initial_elements = abap_true ). ENDMETHOD. Activate Web dynpro component. Run web dynpro application.

Web Dynpro ABAP - ALV row color

Program steps Create Web Dynpro Component with Window and View(Automatically View is embedded into Window).

Define Component Use ALV for the Used component SALV_WD_TABLE under Used Components tab of Web Dynpro Component.

Go to Component Controller of component Properties tab->Define or Include Used Controllers/ Components of ALV.

Context tab->Create PA0002 node with cardinality 0..n. and CELLDESIGN attribute beneath the node PA0002 to collect colour code.

Methods tab->Write the code in WDDOINIT to populate data in ALV.

WDDOINIT method code.METHOD wddoinit . wd_this->get_data( ). wd_this->configure_alv( ).ENDMETHOD. GET_DATA method code.METHOD get_data . DATA lo_nd_pa0002 TYPE REF TO if_wd_context_node. DATA lt_pa0002 TYPE wd_this->elements_pa0002. DATA ls_pa0002 LIKE LINE OF lt_pa0002. "Navigate from to via lead selection lo_nd_pa0002 = wd_context->get_child_node( name = wd_this->wdctx_pa0002 ). SELECT * FROM pa0002 INTO CORRESPONDING FIELDS OF TABLE lt_pa0002 UP TO 40 ROWS. LOOP AT lt_pa0002 INTO ls_pa0002. ls_pa0002-celldesign = sy-tabix. MODIFY lt_pa0002 FROM ls_pa0002. ENDLOOP. lo_nd_pa0002->bind_table( new_items = lt_pa0002 set_initial_elements = abap_true ).

ENDMETHOD. For colour numbers to use in Web Dynpro ALV, we have to refer the below steps.

CONFIGURE_ALV method code.METHOD configure_alv . "Instantiate Used Component DATA lo_cmp_usage TYPE REF TO if_wd_component_usage. lo_cmp_usage = wd_this->wd_cpuse_alv( ). IF lo_cmp_usage->has_active_component( ) IS INITIAL. lo_cmp_usage->create_component( ). ENDIF. "Create an instance of ALV Interface Controller DATA lo_interfacecontroller TYPE REF TO iwci_salv_wd_table . lo_interfacecontroller = wd_this->wd_cpifc_alv( ). "Configuration of the ALV Output DATA lv_value TYPE REF TO cl_salv_wd_config_table. lv_value = lo_interfacecontroller->get_model( ). DATA: lr_column_settings TYPE REF TO if_salv_wd_column_settings, lt_columns TYPE salv_wd_t_column_ref, ls_columns LIKE LINE OF lt_columns, l_column TYPE REF TO cl_salv_wd_column.

lr_column_settings ?= lv_value. lt_columns = lr_column_settings->get_columns( ). LOOP AT lt_columns INTO ls_columns. ls_columns-r_column->set_cell_design_fieldname( value = 'CELLDESIGN' ). lv_value->if_salv_wd_column_settings~delete_column( id = 'CELLDESIGN' ). ENDLOOP.

ENDMETHOD. Go to view ALV_ROW_COLOR_V. Layout tab->Create View Container UI element to display ALV output.

Go to INTERFACECONTROLLER_USAGE of ALV->Map Context node PA0002 of component controller to node DATA of ALV Interface Controller.

Go to window ALV_ROW_COLOR_W->Embed TABLE view of SALV_WD_TABLE component in window as shown in the screen.

Activate Web Dynpro component. Create Web Dynpro Application and Save it as local object.

Run web dynpro application.

Web Dynpro ABAP- Change cell color in ALV Create Web Dynpro Component with Window and View(Automatically View is embedded into Window).

Define Component Use ALV for the Used component SALV_WD_TABLE under Used Components tab of Web Dynpro Component.

Go to Component Controller COMPONENTCONTROLLER. Properties tab->Define or Include Used Controllers/ Components of ALV.

Context tab->Create PA0002 node with cardinality 0..n as shown in the picture. CELLDESIGN attribute is used to setcolourof the cell.

Methods tab->Write the code in WDDOINIT to populate data in ALV and Change ALV Configuration.

WDDOINIT method codeMETHOD wddoinit . wd_this->get_data( ). wd_this->configure_alv( ).ENDMETHOD. GET_DATA method codeMETHOD get_data . DATA lo_nd_pa0002 TYPE REF TO if_wd_context_node. DATA lt_pa0002 TYPE wd_this->elements_pa0002. DATA ls_pa0002 LIKE LINE OF lt_pa0002. "Navigate from to via lead selection lo_nd_pa0002 = wd_context->get_child_node( name = wd_this->wdctx_pa0002 ). SELECT * FROM pa0002 INTO CORRESPONDING FIELDS OF TABLE lt_pa0002 UP TO 40 ROWS. LOOP AT lt_pa0002 INTO ls_pa0002. ls_pa0002-celldesign = cl_wd_table_column=>e_cell_design-goodvalue_light. MODIFY lt_pa0002 FROM ls_pa0002. ENDLOOP. lo_nd_pa0002->bind_table( new_items = lt_pa0002 set_initial_elements = abap_true ).

ENDMETHOD. CONFIGURE_ALV method codeMETHOD configure_alv . "Instantiate Used Component DATA lo_cmp_usage TYPE REF TO if_wd_component_usage. lo_cmp_usage = wd_this->wd_cpuse_alv( ). IF lo_cmp_usage->has_active_component( ) IS INITIAL. lo_cmp_usage->create_component( ). ENDIF. "Create an instance of ALV Interface Controller DATA lo_interfacecontroller TYPE REF TO iwci_salv_wd_table . lo_interfacecontroller = wd_this->wd_cpifc_alv( ). "Configuration of the ALV Output DATA lv_value TYPE REF TO cl_salv_wd_config_table. lv_value = lo_interfacecontroller->get_model( ). DATA: lr_column_settings TYPE REF TO if_salv_wd_column_settings, lt_columns TYPE salv_wd_t_column_ref, ls_columns LIKE LINE OF lt_columns, l_column type REF TO cl_salv_wd_column.

lr_column_settings ?= lv_value. lt_columns = lr_column_settings->get_columns( ). LOOP AT lt_columns INTO ls_columns. CASE ls_columns-id. WHEN 'PERNR'. ls_columns-r_column->set_cell_design_fieldname( value = 'CELLDESIGN' ). lv_value->if_salv_wd_column_settings~delete_column( id = 'CELLDESIGN' ). ENDCASE. ENDLOOP.

ENDMETHOD. Go to view CELL_COLOR_V. Layout tab->Create View Container UI element to display ALV output.

Go to INTERFACECONTROLLER_USAGE of ALV->Map Context node PA0002 of component controller to node DATA of ALV Interface Controller.

Go to window CELL_COLOR_W->Embed TABLE view of SALV_WD_TABLE component in window as shown in the screen.

Activate Web Dynpro component. Create Web Dynpro Application and Save it as local object.

Run web dynpro application.

Web Dynpro Selection-Screen

Select-Options in Web Dynpro ABAP

Select-Options in ABAP

Using Select-Options, the user can specify complex selection criteria. If the selection criteria is complex, you need not write lengthy logical expressions in the select query, which is solved by the select-options statement. Select-Options defines a range table which is having four columns Sign, Option, Low and High.SELECT-OPTIONS : so_pernr for pernr-pernr.

Select-Options in Web Dynpro ABAPTo show a select options in Web Dynpro ABAP, We have to use SAPs Standard component WDR_SELECT_OPTIONS.Select options in Web Dynpro work the same way as in ABAP reports.

Procedure to achieve SELECT OPTIONS for a field Create Web Dynpro Component with Window and View.(Automatically View is embedded into Window). Define Component Use for theWDR_SELECT_OPTIONSunder Used Components tab of Web Dynpro Component. Define Controller usage forWDR_SELECT_OPTIONSin the Properties tab of view. Create ViewContainerUIElement in the view Layout. Do the following in WDDOINIT hook method. Instantiate Used ComponentWDR_SELECT_OPTIONS. Instantiate Used Component ControllerIWCI_WDR_SELECT_OPTIONSand and Call methodINIT_SELECTION_SCREEN. Create Range Table usingIF_WD_SELECT_OPTIONS->CREATE_RANGE_TABLE. Add Selection field by passing Range table and Field toIF_WD_SELECT_OPTIONS-> ADD_SELECTION_FIELD. Go to Window of the component->View->ViewContainerUIElement Embed the viewWND_SELECTION_SCREENof Used ComponentWDR_SELECT_OPTIONS intoViewContainerUIElementof Web Dynpro Component. Activate Web Dynpro Component Create Web Dynpro Application and Run.

Please Click here for Detail.

OVS Search Help in Select Option-Webdynpro ABAPSteps to achieve the functionality:We use eventON_OVSof ComponentWDR_SELECT_OPTIONS. Create Web Dynpro Component with View and Window(Automatically View is embedded into Window) and Save it as local object.

Define Component Use SELECT_OPT for the Used component WDR_SELECT_OPTIONS under Used Components tab of Web Dynpro Component.

Go to View OVS_SEARCH_V->Properties tab->Define or Include Used Controllers/ Components of Select Options.

Go to view OVS_SEARCH_V->Context tab->Create node TAB_P0002 with cardinality 0..n and attributes inside.

Go to view OVS_SEARCH_V->Layout tab->Create ViewContainerUIElement to hold Select-Option field. Create ViewContainerUIElement to hold Select-Option field.

Create button->CreateOnActionevent to get the values entered in Select-Option field and Display related records in the table.

Create Table UI element->Bind the Context node TAB_P0002with table UI element.

Go to view OVS_SEARCH_V->Methods tab->Write the following code in WDDOINIT hook method. Instantiate Used Component WDR_SELECT_OPTIONS. Instantiate Used Component Controller IWCI_WDR_SELECT_OPTIONS and and Call method INIT_SELECTION_SCREEN.. Create Range Table using IF_WD_SELECT_OPTIONS->CREATE_RANGE_TABLE.. Add Selection field by passing Range table and Field to IF_WD_SELECT_OPTIONS-> ADD_SELECTION_FIELD .. code. METHOD wddoinit .. "Instantiate Used Component. DATA lo_cmp_usage TYPE REF TO if_wd_component_usage.. lo_cmp_usage = wd_this->wd_cpuse_select_opt( ).. IF lo_cmp_usage->has_active_component( ) IS INITIAL.. lo_cmp_usage->create_component( ).. ENDIF.. "Instantiate Used Controller and Call Init_selection_screen method.. DATA lo_interfacecontroller TYPE REF TO iwci_wdr_select_options .. lo_interfacecontroller = wd_this->wd_cpifc_select_opt( ).. DATA lv_r_helper_class TYPE REF TO if_wd_select_options.. lv_r_helper_class = lo_interfacecontroller->init_selection_screen( ).. "Create Range table. DATA:rt_table TYPE REF TO data.. CALL METHOD lv_r_helper_class->create_range_table. EXPORTING. i_typename = 'PERSNO'. RECEIVING. rt_range_table = rt_table.. "Disable CANCEL, CHECK, RESET and COPY buttons. CALL METHOD lv_r_helper_class->set_global_options. EXPORTING. i_display_btn_cancel = abap_false. i_display_btn_check = abap_false. i_display_btn_reset = abap_false. i_display_btn_execute = abap_false.. "Add range field to Selection screen. CALL METHOD lv_r_helper_class->add_selection_field. EXPORTING. i_id = 'PERSNO'. it_result = rt_table. i_value_help_type = if_wd_value_help_handler=>co_prefix_ovs.. . ENDMETHOD.. Go to view OVS_SEARCH_V->Methods tab->Write the below code for ONACTIONSEARCH_EMP event handler method for button.. code. METHOD onactionsearch_emp .. "Instantiate Used Component. DATA lo_cmp_usage TYPE REF TO if_wd_component_usage.. lo_cmp_usage = wd_this->wd_cpuse_select_opt( ).. IF lo_cmp_usage->has_active_component( ) IS INITIAL.. lo_cmp_usage->create_component( ).. ENDIF.. "Instantiate Used Controller and Call Init_selection_screen method.. DATA lo_interfacecontroller TYPE REF TO iwci_wdr_select_options .. lo_interfacecontroller = wd_this->wd_cpifc_select_opt( ).. DATA lv_r_helper_class TYPE REF TO if_wd_select_options.. lv_r_helper_class = lo_interfacecontroller->init_selection_screen( ).. "Read Select option. DATA:rt_table TYPE REF TO data.. CALL METHOD lv_r_helper_class->get_range_table_of_sel_field. EXPORTING. i_id = 'PERSNO'. RECEIVING. rt_range_table = rt_table.. "Populate EMP_ADD table. DATA lo_nd_tab_p0002 TYPE REF TO if_wd_context_node.. DATA lt_tab_p0002 TYPE wd_this->elements_tab_p0002.. FIELD-SYMBOLS: TYPE table.. . ASSIGN rt_table->* TO .. SELECT *. FROM pa0002. INTO TABLE lt_tab_p0002. WHERE pernr IN .. "navigate from to via lead selection. lo_nd_tab_p0002 = wd_context->get_child_node( name = wd_this->wdctx_tab_p0002 ).. lo_nd_tab_p0002->bind_table( new_items = lt_tab_p0002 set_initial_elements = abap_true ).. . ENDMETHOD.. . Go to viewOVS_SEARCH_V->Methods tab->Create one Event Handler method OVS_ON_SO ->Select the event ON_OVS of component WDR_SELECT_OPTIONS using F4 help for Event field. Double click on OVS_ON_SO method->Write the below code. METHOD ovs_on_so . TYPES: BEGIN OF ty_p0002, pernr TYPE pa0002-pernr, endda TYPE pa0002-endda, begda TYPE pa0002-begda, nachn TYPE pa0002-nachn, vorna TYPE pa0002-vorna, titel TYPE pa0002-titel, END OF ty_p0002. DATA: ls_p0002 TYPE ty_p0002, lt_p0002 TYPE STANDARD TABLE OF ty_p0002. FIELD-SYMBOLS: LIKE lt_p0002, LIKE LINE OF , TYPE STANDARD TABLE. CASE i_ovs_data-m_ovs_callback_object->phase_indicator. "Set Configuration WHEN if_wd_ovs=>co_phase_0. "Preassign Entry Values WHEN if_wd_ovs=>co_phase_1. "Fill Value List WHEN if_wd_ovs=>co_phase_2. SELECT pernr nachn vorna FROM pa0002 INTO CORRESPONDING FIELDS OF TABLE lt_p0002 UP TO 200 ROWS. i_ovs_data-m_ovs_callback_object->set_output_table( output = lt_p0002 ). "Value Return WHEN if_wd_ovs=>co_phase_3. ASSIGN i_ovs_data-m_ovs_callback_object->selection->* TO . ASSIGN i_ovs_data-mt_selected_values->* TO . INSERT -pernr INTO TABLE . WHEN OTHERS. ENDCASE. ENDMETHOD. Go to Window OVS_SEARCH_W->Open view OVS_SEARCH_V->Right click on VCE ViewContainerUIElement->Embed view WND_SELECTION_SCREEN of WDR_SELECT_OPTIONS component.

Activate Web Dynpro component.

Create Web Dynpro Application and Save it as local object.

OVS Input help for field - Web Dynpro ABAPSteps to achieve functionality Create Web Dynpro Component with Window and View(Automatically View is embedded into Window).

Define Component Use OVS_PERNR for the Used component WDR_OVS under Used Components tab of Web Dynpro Component.

Go to View OVS_V->Properties tab->Define or Include Used Controllers/ Components of OVS.

Go to View OVS_V->Context tab Create node N1. Create one attribute PERNR of type NUM8(NUMC -8) Select Input Help mode as Object Value Selector Select OVS Component usage OVS_PERNR from F4 help.

Go to View OVS_V->Layout tab->Create one input and bind it with node N1 attribute PERNR.

Go to View OVS_V->Methods tab->Give method name as OVS_ON_FIELD, method type Event Handler and Select Event OVS of Component Usage OVS_PERNR from F4 help as shown in the figure.

Double click on OVS_ON_FIELD method->Below code is auto generated.

Auto Generated codemethod OVS_SS .* declare data structures for the fields to be displayed and* for the table columns of the selection list, if necessary types: begin of lty_stru_input,* add fields for the display of your search input here field1 type string, end of lty_stru_input. types: begin of lty_stru_list,* add fields for the selection list here column1 type string, end of lty_stru_list.

data: ls_search_input type lty_stru_input, lt_select_list type standard table of lty_stru_list, ls_text type wdr_name_value, lt_label_texts type wdr_name_value_list, lt_column_texts type wdr_name_value_list, lv_window_title type string, lv_group_header type string, lv_table_header type string.

field-symbols: type lty_stru_input, type lty_stru_list.

case ovs_callback_object->phase_indicator.

when if_wd_ovs=>co_phase_0. "configuration phase, may be omitted* in this phase you have the possibility to define the texts,* if you do not want to use the defaults (DDIC-texts)

ls_text-name = `FIELD1`. "must match a field name of search ls_text-value = `MYTEXT`. "wd_assist->get_text( `001` ). insert ls_text into table lt_label_texts.

ls_text-name = `COLUMN1`. "must match a field in list structure ls_text-value = `MYTEXT2`. "wd_assist->get_text( `002` ). insert ls_text into table lt_column_texts.

* lv_window_title = wd_assist->get_text( `003` ).* lv_group_header = wd_assist->get_text( `004` ).* lv_table_header = wd_assist->get_text( `005` ).

ovs_callback_object->set_configuration( label_texts = lt_label_texts column_texts = lt_column_texts group_header = lv_group_header window_title = lv_window_title table_header = lv_table_header col_count = 2 row_count = 20 ).

when if_wd_ovs=>co_phase_1. "set search structure and defaults* In this phase you can set the structure and default values* of the search structure. If this phase is omitted, the search* fields will not be displayed, but the selection table is* displayed directly.* Read values of the original context (not necessary, but you* may set these as the defaults). A reference to the context* element is available in the callback object.

ovs_callback_object->context_element->get_static_attributes( importing static_attributes = ls_search_input ).* pass the values to the OVS component ovs_callback_object->set_input_structure( input = ls_search_input ).

when if_wd_ovs=>co_phase_2.* If phase 1 is implemented, use the field input for the* selection of the table.* If phase 1 is omitted, use values from your own context.

if ovs_callback_object->query_parameters is not bound.******** TODO exception handling endif. assign ovs_callback_object->query_parameters->* to . if not is assigned.******** TODO exception handling endif.

* call business logic for a table of possible values* lt_select_list = ???

ovs_callback_object->set_output_table( output = lt_select_list ).

when if_wd_ovs=>co_phase_3.* apply result

if ovs_callback_object->selection is not bound.******** TODO exception handling endif.

assign ovs_callback_object->selection->* to . if is assigned.* ovs_callback_object->context_element->set_attribute(* name = `COLUMN1`* value = -column1 ).* or* ovs_callback_object->context_element->set_static_attributes(* static_attributes = ).

endif. endcase.

endmethod. Change the code according to our requirement and make it workable.METHOD ovs_on_field . TYPES: BEGIN OF lty_stru_list,* add fields for the selection list here pernr TYPE pa0002-pernr, nachn TYPE pa0002-nachn, vorna TYPE pa0002-vorna, END OF lty_stru_list.

DATA: lt_select_list TYPE STANDARD TABLE OF lty_stru_list, ls_text TYPE wdr_name_value, lt_label_texts TYPE wdr_name_value_list, lt_column_texts TYPE wdr_name_value_list.

FIELD-SYMBOLS: TYPE lty_stru_list.

CASE ovs_callback_object->phase_indicator. WHEN if_wd_ovs=>co_phase_0. "configuration phase, may be omitted WHEN if_wd_ovs=>co_phase_1. "set search structure and defaults WHEN if_wd_ovs=>co_phase_2.* If phase 1 is implemented, use the field input for the* selection of the table.* If phase 1 is omitted, use values from your own context.* call business logic for a table of possible values SELECT pernr nachn vorna FROM pa0002 INTO CORRESPONDING FIELDS OF TABLE lt_select_list UP TO 200 ROWS. ovs_callback_object->set_output_table( output = lt_select_list ). WHEN if_wd_ovs=>co_phase_3.* apply result ASSIGN ovs_callback_object->selection->* TO . IF IS ASSIGNED. ovs_callback_object->context_element->set_static_attributes( static_attributes = ). ENDIF. ENDCASE.

ENDMETHOD. Activate Web Dynpro Component Create Web Dynpro Application and Save it as local object.

Run the Web Dynpro Application.

Web Dynpro ABAP - Manipulating the context dynamicallyIF_WD_CONTEXT_NODE_INFO Interface: This interface is used to modify controller contexts at runtime.The interface is the interface of the metadata of a Context node and is used to describe what the data looks like.Example: Let us take one statically defined context.

Steps to create Context node and underneath attributes Get the reference to the meta data of the context node that will act as the new node's parent.It means we are getting reference to the meta data of the root node. DATA LO_ROOT_NODE_INFO TYPE REF TO IF_WD_CONTEXT_NODE_INFO. "Get meta data info of ROOT context node LO_ROOT_NODE_INFO = WD_CONTEXT->GET_NODE_INFO( ). To define new node, call method LO_ROOT_NODE_INFO->add_new_child_node. DATA LO_ROOT_NODE_INFO TYPE REF TO IF_WD_CONTEXT_NODE_INFO. DATA LO_IT001_NODE_INFO TYPE REF TO IF_WD_CONTEXT_NODE_INFO. "Get meta data info of ROOT context node LO_ROOT_NODE_INFO = WD_CONTEXT->GET_NODE_INFO( ). "Create node with name 'IT0001' without any attributes CALL METHOD LO_ROOT_NODE_INFO->ADD_NEW_CHILD_NODE EXPORTING NAME = 'IT0001' IS_MANDATORY = ABAP_FALSE IS_MANDATORY_SELECTION = ABAP_FALSE IS_MULTIPLE = ABAP_FALSE IS_MULTIPLE_SELECTION = ABAP_FALSE IS_SINGLETON = ABAP_FALSE IS_INITIALIZE_LEAD_SELECTION = ABAP_TRUE IS_STATIC = ABAP_TRUE RECEIVING CHILD_NODE_INFO = LO_IT001_NODE_INFO. Node IT0001 is ready now. We need to create context attributes in the node IT0001. DATA LO_ROOT_NODE_INFO TYPE REF TO IF_WD_CONTEXT_NODE_INFO. DATA LO_IT001_NODE_INFO TYPE REF TO IF_WD_CONTEXT_NODE_INFO. DATA LS_ATTRIBUTE TYPE WDR_CONTEXT_ATTRIBUTE_INFO. "Get meta data info of ROOT context node LO_ROOT_NODE_INFO = WD_CONTEXT->GET_NODE_INFO( ). "Create node with name 'IT0001' without any attributes CALL METHOD LO_ROOT_NODE_INFO->ADD_NEW_CHILD_NODE EXPORTING NAME = 'IT0001' IS_MANDATORY = ABAP_FALSE IS_MANDATORY_SELECTION = ABAP_FALSE IS_MULTIPLE = ABAP_FALSE IS_MULTIPLE_SELECTION = ABAP_FALSE IS_SINGLETON = ABAP_FALSE IS_INITIALIZE_LEAD_SELECTION = ABAP_TRUE IS_STATIC = ABAP_TRUE RECEIVING CHILD_NODE_INFO = LO_IT001_NODE_INFO. "Define Attribute PERNR LS_ATTRIBUTE-NAME = 'PERNR'. LS_ATTRIBUTE-TYPE_NAME = 'PERNR_D'. LS_ATTRIBUTE-VALUE_HELP_MODE = '0'. CALL METHOD LO_IT001_NODE_INFO->ADD_ATTRIBUTE EXPORTING ATTRIBUTE_INFO = LS_ATTRIBUTE. "Define Attribute BUKRS LS_ATTRIBUTE-NAME = 'BUKRS'. LS_ATTRIBUTE-TYPE_NAME = 'BUKRS'. LS_ATTRIBUTE-VALUE_HELP_MODE = '0'. CALL METHOD LO_IT001_NODE_INFO->ADD_ATTRIBUTE EXPORTING ATTRIBUTE_INFO = LS_ATTRIBUTE. "Define Attribute PERNR LS_ATTRIBUTE-NAME = 'ENAME'. LS_ATTRIBUTE-TYPE_NAME = 'EMNAM'. LS_ATTRIBUTE-VALUE_HELP_MODE = '0'. CALL METHOD LO_IT001_NODE_INFO->ADD_ATTRIBUTE EXPORTING ATTRIBUTE_INFO = LS_ATTRIBUTE.Creating a Context Node and Context Attributes from a Structure:An ABAP Dictionary flat structure type (structure, database view or transparent table) can be passed to the method using the parameter static_element_type. All attributes for this structure are created automatically. Get the reference(LO_ROOT_NODE_INFO) to the meta data of the context node that will act as the new node's parent.It means we are getting reference to the meta data of the root node. To define new node, call method LO_ROOT_NODE_INFO->ADD_NEW_CHILD_NODE. Use parameter STATIC_ELEMENT_TYPE to pass the name of DDIC structure(PA0001) to the method LO_ROOT_NODE_INFO->ADD_NEW_CHILD_NODE. DATA LO_ROOT_NODE_INFO TYPE REF TO IF_WD_CONTEXT_NODE_INFO. DATA LO_IT001_NODE_INFO TYPE REF TO IF_WD_CONTEXT_NODE_INFO. DATA LS_ATTRIBUTE TYPE WDR_CONTEXT_ATTRIBUTE_INFO. " Get meta data info of ROOT context node LO_ROOT_NODE_INFO = WD_CONTEXT->GET_NODE_INFO( ). " Create node with name 'IT0001' of DDIC type PA0001 with all attributes CALL METHOD LO_ROOT_NODE_INFO->ADD_NEW_CHILD_NODE EXPORTING STATIC_ELEMENT_TYPE = 'PA0001' NAME = 'IT0001' IS_MANDATORY = ABAP_FALSE IS_MANDATORY_SELECTION = ABAP_FALSE IS_MULTIPLE = ABAP_FALSE IS_MULTIPLE_SELECTION = ABAP_FALSE IS_SINGLETON = ABAP_FALSE IS_INITIALIZE_LEAD_SELECTION = ABAP_TRUE RECEIVING CHILD_NODE_INFO = LO_IT001_NODE_INFO.

Navigation Between Two Views We