- Step1 : Create a webdynpro component ZWDT_DEMO_ALV in SE80
- Step2 : Add ALV table and define context
- Step3 : Add View Container UI element in main view
- Step4 : Embedd interface view into view container
- Step5 : Create external context mapping for ALV
- Step6 : Add Business logic to fill ALV table
- Step7 : Make Webdynpro ALV as editable
Step1:Create a webdynpro component ZWDT_DEMO_ALV in SE80 Important Top^
Create a webdynpro component ZSAPN_EDITABLE_ALV in SE80.
Step2:Add ALV table and define context Medium Top^
Add standard ALV component SALV_WD_TABLE at the root level of webdynpro component.
We need to map our context with interface component so we need to add our context nodes in component controller only, go to component controller and add a node with name MARA with four attributes (MATNE, MTART, MBRSH, MEINS, MATKL).
Go to Component controller, right click on context and click on create->node .
Click on add attributes from structure and select MATNR, MTART, MBRSH, MATKL, MEINS and enter, save.
Step3:Add View Container UI element in main view Medium Top^
Now go to main view of component and add a view container UI element, we need to embed interface view of ALV to display ALV in our component.
A popup will open provide some id and select ViewContainerUIelement , enter.
Step4:Embedd interface view into view container Important Top^
After adding view container UI element, go to window, right click on view container UI element, click on embed.
a popup will open. Click F4 on View to Be Embedded, Select TABLE interface view and click on continue (Enter).
Step5:Create external context mapping for ALV Important Top^
Data in the ALV will be displayed using interface controller, by mapping our node to interface node data of interface controller, we can display data on ALV table, follow the below steps for external context mapping.
Expand Component Usages->ALV->INTERFACECONTROLLER_USAGE .
Click on Controller Usage a popup will open, select Component controller and enter.
Step6:Add Business logic to fill ALV table Important Top^
External context mapping to ALV component is completed, now we need to add logic to fill node to display data on ALV.
Now go to WDDOINIT and add the below code.
**This method will trigger first so we add some data here for test purpose DATA LO_ND_MARA TYPE REF TO IF_WD_CONTEXT_NODE. DATA LT_MARA TYPE WD_THIS->ELEMENTS_MARA. * navigate fromto via lead selection LO_ND_MARA = WD_CONTEXT->GET_CHILD_NODE( NAME = WD_THIS->WDCTX_MARA ). *get data from MARA SELECT MATNR MTART MEINS MBRSH MATKL FROM MARA INTO TABLE LT_MARA UP TO 50 ROWS. LO_ND_MARA->BIND_TABLE( NEW_ITEMS = LT_MARA SET_INITIAL_ELEMENTS = ABAP_TRUE ).
Save and Double click on component name, activate the component.
Create application and test, right click on component name Create->Web Dynpro Application.
Provide name and description, save and test .
The out put will be like below, our next step is to make ALV as editable .
Step7:Make Webdynpro ALV as editable Important Top^
Webdynpro ALV is completed, now we need to make all columns in ALV editable.
To make ALV as editable follow below steps in WDDOINIT method
Step1--Instantiate used component ALV.
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.Step2--Get ALV configuration settings using used controller method GET_MODEL.
DATA LO_INTERFACECONTROLLER TYPE REF TO IWCI_SALV_WD_TABLE . LO_INTERFACECONTROLLER = WD_THIS->WD_CPIFC_ALV( ). DATA LV_VALUE TYPE REF TO CL_SALV_WD_CONFIG_TABLE. LV_VALUE = LO_INTERFACECONTROLLER->GET_MODEL( ) .Step3--Get All the Columns of ALV table.
**Get alv columns uisng ALV config class DATA : LR_COLUMNS TYPE SALV_WD_T_COLUMN_REF . "this is table type DATA : LS_COLUMNS TYPE SALV_WD_S_COLUMN_REF . "declare line type of columns CALL METHOD LV_VALUE->IF_SALV_WD_COLUMN_SETTINGS~GET_COLUMNS RECEIVING VALUE = LR_COLUMNS. "get columns into a columns tableStep4-- Loop through all columns and Insert input field into ALV columns.
**Now insert input field into each column**Create object for input field DATA : LR_INPUT TYPE REF TO CL_SALV_WD_UIE_INPUT_FIELD . LOOP AT LR_COLUMNS INTO LS_COLUMNS.**Create object for input CREATE OBJECT LR_INPUT EXPORTING VALUE_FIELDNAME = LS_COLUMNS-ID. "Column name*ls_columns-r_column is the column instance, we can use it to insert input field CALL METHOD LS_COLUMNS-R_COLUMN->SET_CELL_EDITOR EXPORTING VALUE = LR_INPUT. " we are inserting input field instance ENDLOOP.Step5-- Set SET_READ_ONLY false .
**By default ALV will be set to read only, we have to make this false to make editable CALL METHOD LV_VALUE->IF_SALV_WD_TABLE_SETTINGS~SET_READ_ONLY EXPORTING VALUE = ABAP_FALSE .
The Full Code for Making Web Dynpro ALV as editable (Add in WDDOINIT method)
**This method will trigger first so we add soem data here for test purpose DATA LO_ND_MARA TYPE REF TO IF_WD_CONTEXT_NODE. DATA LT_MARA TYPE WD_THIS->ELEMENTS_MARA. * navigate fromto via lead selection LO_ND_MARA = WD_CONTEXT->GET_CHILD_NODE( NAME = WD_THIS->WDCTX_MARA ). SELECT MATNR MTART MEINS MBRSH MATKL FROM MARA INTO TABLE LT_MARA UP TO 50 ROWS. ** MARA table has huge data so we get first 50 records for test LO_ND_MARA->BIND_TABLE( NEW_ITEMS = LT_MARA SET_INITIAL_ELEMENTS = ABAP_TRUE ). 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. DATA LO_INTERFACECONTROLLER TYPE REF TO IWCI_SALV_WD_TABLE . LO_INTERFACECONTROLLER = WD_THIS->WD_CPIFC_ALV( ). DATA LV_VALUE TYPE REF TO CL_SALV_WD_CONFIG_TABLE. LV_VALUE = LO_INTERFACECONTROLLER->GET_MODEL( ). "ALV configurations **Get alv columns uisng ALV config class DATA : LR_COLUMNS TYPE SALV_WD_T_COLUMN_REF . "this is table type DATA : LS_COLUMNS TYPE SALV_WD_S_COLUMN_REF . "declare line type of columns CALL METHOD LV_VALUE->IF_SALV_WD_COLUMN_SETTINGS~GET_COLUMNS RECEIVING VALUE = LR_COLUMNS. "get columns into a columns table **Now insert input field into each column **Create object for input field DATA : LR_INPUT TYPE REF TO CL_SALV_WD_UIE_INPUT_FIELD . LOOP AT LR_COLUMNS INTO LS_COLUMNS. **Create object for input CREATE OBJECT LR_INPUT EXPORTING VALUE_FIELDNAME = LS_COLUMNS-ID. "Column name *ls_columns-r_column is the column instance, we can use it to insert input field CALL METHOD LS_COLUMNS-R_COLUMN->SET_CELL_EDITOR EXPORTING VALUE = LR_INPUT. " we are inserting input field instance ENDLOOP. **By default ALV will be set to read only, we have to make this false to make editable CALL METHOD LV_VALUE->IF_SALV_WD_TABLE_SETTINGS~SET_READ_ONLY EXPORTING VALUE = ABAP_FALSE.
The final result will be.
when i was running this application ,error is (The following error text was processed in the system EC6 : Die URL enthält keine vollständige Domainangabe (visuinfoec6 statt visuinfoec6..))