Simple Example for Drag And Drop In ABAP -Webdynpro - WDA
Objective :To Demonstrate a simple drag and drop application for WDA.
Pre-requisite: A Basic knowledge of Webdynpro in ABAP.
Solution:
Step 1. Create a webdynpro Component and application : ZDRAG_TEST
Step 2. Insert two group UI Elements, Name First as ‘Source’ and second as ‘Destination’.
Step 3. Insert A Image in group1 and a Dragsourceinfo element for this image .
Create an attribute ‘image_src’ type string , and assign it to Image ‘Source’ property.
Step 4. In the ‘Tags’ properties of Dragsourceinfo , assign a tag ‘Image1’.
Step 5. Now in the second group insert a drop target ui element. And create an action for this as ‘Drop_it’
Step 6. In the Drop Target UI element insert a image2, and a drop target info ui element. Create an attribute ‘image2_src’ type string , and assign it to Image ‘Source’ property.
In the Tags property of “drop target info” assign ‘Image1’ value.
Code :
Method WD_INIT: insert the following code:
wd_context->set_attribute( name = 'IMAGE_SRC' value = '~Pictogram/2DocsStar' ).
wd_context->set_attribute( name = 'IMAGE2_SRC' value = '~Icon/Add' ).
Method: DROP_IT:
wd_context->set_attribute( name = 'DATA' value = data ).
DATA lo_el_context TYPE REF TO if_wd_context_element.
DATA ls_context TYPE wd_this->element_context.
DATA lv_image_src TYPE wd_this->element_context-image_src.
* get element via lead selection
lo_el_context = wd_context->get_element( ).* @TODO handle not set lead selection
IF lo_el_context IS INITIAL.
ENDIF.
* get single attribute
lo_el_context->get_attribute(
EXPORTING
name = `IMAGE_SRC`
IMPORTING
value = lv_image_src ).
DATA lv_image2_src TYPE wd_this->element_context-image2_src.
* get element via lead selection
lo_el_context = wd_context->get_element( ).
* @TODO handle not set lead selection
IF lo_el_context IS INITIAL.
ENDIF.
* @TODO fill attribute* lv_image2_src = 1.
* set single attribute
lo_el_context->set_attribute(
name = `IMAGE2_SRC`
value = lv_image_src ).
lo_el_context->set_attribute(
name = `IMAGE_SRC`
value = '' ).
Bluesky