Using table UI element in webdynpro ABAP

Requirement : Develop a web dynpro component to display list of vendors .

UI elements to be used in this requirement are INPUT FIELD,LABEL, BUTTON and TABLE .

Step1 : Create context for storing table data.

Step2: Insert TABLE UI element .

Step3: Create data binding for table.

Step4: Add logic to get data.

Step1: Go to Context and Create a node.Go to SE80, create a web dynpro component ZSAPN_TABLE, save it in a local object.

Go to context of main view, click on change mode, right click on context -> create -> node.

A popup will open, provide node name as LFA1, data dictionary structure as LFA1, click on add attributes from structure button.

Select required attributes, enter.

Step2: Go to layout and insert table UI element.Go to view layout, right click on ROOTUIELEMENTCONTAINER, insert element, provide a id and select table, enter.

Step3:Create data binding for table.Right click on table, click on create binding, click on context.

Select LFA1.

Step4: Add logic to get data.Go to METHODS tab, double click on WDDOINIT add below code.

DATA LO_ND_LFA1 TYPE REF TO IF_WD_CONTEXT_NODE.

  DATA LT_LFA1 TYPE WD_THIS->ELEMENTS_LFA1.

*   navigate from  to  via lead selection
  LO_ND_LFA1 = WD_CONTEXT->GET_CHILD_NODE( NAME = WD_THIS->WDCTX_LFA1 ).

*   @TODO handle non existant child
*   IF lo_nd_lfa1 IS INITIAL.
*   ENDIF.

*  * @TODO compute values
*  * e.g. call a model function
*
  SELECT LIFNR NAME1 LAND1 ORT01 FROM LFA1 INTO TABLE LT_LFA1 UP TO 50 ROWS.
  LO_ND_LFA1->BIND_TABLE( NEW_ITEMS = LT_LFA1 SET_INITIAL_ELEMENTS = ABAP_TRUE ).

Step5: Right click on component, create application and test.