Ramakrishnappa Gangappa

January 10, 2014 6 minute read

Attach files with save, retrieve and delete functionality in Web Dynpro ABAP – Part 2

Continues……

Pre-requisite: ( Please go through the below link before you continue )

Attach files with save, retrieve and delete functionality in Web Dynpro ABAP – Part 1

Step 7:

Create a table ui element TBL_LIST and bind it to the context node ATTACHMENT_LIST as below

Note: choose editor for FILE_NAME attribute as FILE DOWNLOAD (ui element )

Step 8:

Go the column editor TBL_LIST_FILE_NAME_EDITOR and bind the properties as show below

Step 9:

Create a tool bar to the table TBL_LIST and add a button BTN_SAVE and attach an action as show below

Add the below code (Save functionality) in event handler method ONACTIONSAVE

ONACTIONSAVE
METHOD onactionsave . DATA lo_nd_attachment_list TYPE REF TO if_wd_context_node. DATA lt_attachment_list TYPE wd_this->elements_attachment_list. DATA lo_msg_manager TYPE REF TO if_wd_message_manager. FIELD-SYMBOLS <fs_attachment_list> LIKE LINE OF lt_attachment_list. lo_nd_attachment_list = wd_context->get_child_node( name = wd_this->wdctx_attachment_list ). lo_nd_attachment_list->get_static_attributes_table( IMPORTING table = lt_attachment_list ). DATA lt_data TYPE TABLE OF ytr_attach_files. DATA ls_data LIKE LINE OF lt_data. “========================================================== “Loop over attachment list for only new attachments “========================================================== LOOP AT lt_attachment_list ASSIGNING <fs_attachment_list> WHERE status = abap_false.” new attachment ” set status <fs_attachment_list>-status = abap_true. CLEAR ls_data. MOVE-CORRESPONDING <fs_attachment_list> TO ls_data. APPEND ls_data TO lt_data. ENDLOOP. “get message manager lo_msg_manager = wd_comp_controller->wd_get_api( )->get_message_manager( ). IF lt_data[] IS INITIAL. ” Attachement list is already saved lo_msg_manager->report_error_message( message_text = ‘Attachement list is already saved’ ). RETURN. ENDIF. “========================================================== ” Save attachments “========================================================== MODIFY ytr_attach_files FROM TABLE lt_data. IF sy-subrc IS INITIAL. ” after successful save, update the status lo_nd_attachment_list->bind_table( EXPORTING new_items = lt_attachment_list ). ” Show success message lo_msg_manager->report_success( message_text = ‘Attachement list saved successfully !!!’ ). ENDIF. ENDMETHOD.

ONACTIONSAVE

METHOD onactionsave .
DATA lo_nd_attachment_list TYPE REF TO if_wd_context_node.
DATA lt_attachment_list TYPE wd_this->elements_attachment_list.
DATA lo_msg_manager TYPE REF TO if_wd_message_manager.

FIELD-SYMBOLS <fs_attachment_list> LIKE LINE OF lt_attachment_list.

lo_nd_attachment_list =
wd_context->get_child_node( name = wd_this->wdctx_attachment_list ).

lo_nd_attachment_list->get_static_attributes_table(
IMPORTING table = lt_attachment_list ).

DATA lt_data TYPE TABLE OF ytr_attach_files.
DATA ls_data LIKE LINE OF lt_data.

“==========================================================
“Loop over attachment list for only new attachments
“==========================================================

LOOP AT lt_attachment_list ASSIGNING <fs_attachment_list>
WHERE status = abap_false.” new attachment

” set status
<fs_attachment_list>-status = abap_true.

    CLEAR ls_data.
    MOVE-CORRESPONDING <fs_attachment_list> TO ls_data.
    APPEND ls_data TO lt_data.

ENDLOOP.

“get message manager
lo_msg_manager =
wd_comp_controller->wd_get_api( )->get_message_manager( ).

IF lt_data[] IS INITIAL.
    ” Attachement list is already saved
    lo_msg_manager->report_error_message(
        message_text = ‘Attachement list is already saved’ ).

RETURN.
ENDIF.

“==========================================================
” Save attachments
“==========================================================
MODIFY ytr_attach_files FROM TABLE lt_data.
IF sy-subrc IS INITIAL.
    ” after successful save, update the status
    lo_nd_attachment_list->bind_table(
      EXPORTING
        new_items            =    lt_attachment_list
    ).

” Show success message
lo_msg_manager->report_success(
message_text = ‘Attachement list saved successfully !!!’ ).
ENDIF.

ENDMETHOD.

Step 10:

Create another button BTN_DELETE (to delete files ) and attach the action DELETE_ATTACHMENT as shown below

Add the below code in (Delete functionality) in event handler method ONACTIONDELETE_ATTACHMENT

ONACTIONDELETE_ATTACHMENT
METHOD onactiondelete_attachment . DATA lo_node TYPE REF TO if_wd_context_node. DATA lt_elements TYPE wdr_context_element_set. DATA lo_element TYPE REF TO if_wd_context_element. DATA ls_attach_list TYPE wd_this->element_attachment_list. DATA lo_msg_manager TYPE REF TO if_wd_message_manager. “========================================================== ” Get the selected elements from the context “========================================================== lo_node = wd_context->get_child_node( name = wd_this->wdctx_attachment_list ). lt_elements = lo_node->get_selected_elements( ). IF lt_elements[] IS INITIAL. “report error message, Please choose a file to delete lo_msg_manager = wd_comp_controller->wd_get_api( )->get_message_manager( ). lo_msg_manager->report_error_message( message_text = ‘Please select atleast 1 row’ ). RETURN. ENDIF. DATA lt_data TYPE TABLE OF ytr_attach_files. DATA ls_data LIKE LINE OF lt_data. CLEAR lt_data. “========================================================== ” Delete the record from attachment list “========================================================== LOOP AT lt_elements INTO lo_element. lo_element->get_static_attributes( IMPORTING static_attributes = ls_attach_list ). ” delete from the context node lo_node->remove_element( element = lo_element ). “Check if record exists in table IF ls_attach_list-status = abap_true. CLEAR ls_data. MOVE-CORRESPONDING ls_attach_list TO ls_data. APPEND ls_data TO lt_data. ENDIF. ENDLOOP. “========================================================== ” Delete the record(s) from data base table “========================================================== DELETE ytr_attach_files FROM TABLE lt_data. ENDMETHOD.

ONACTIONDELETE_ATTACHMENT

METHOD onactiondelete_attachment .
DATA lo_node        TYPE REF TO if_wd_context_node.
DATA lt_elements    TYPE wdr_context_element_set.
DATA lo_element     TYPE REF TO if_wd_context_element.
DATA ls_attach_list TYPE wd_this->element_attachment_list.
DATA lo_msg_manager TYPE REF TO if_wd_message_manager.

“==========================================================
” Get the selected elements from the context
“==========================================================
lo_node =
wd_context->get_child_node( name = wd_this->wdctx_attachment_list ).

lt_elements =
lo_node->get_selected_elements( ).

IF lt_elements[] IS INITIAL.
    “report error message, Please choose a file to delete
    lo_msg_manager =
    wd_comp_controller->wd_get_api( )->get_message_manager( ).

lo_msg_manager->report_error_message(
message_text = ‘Please select atleast 1 row’ ).

RETURN.
ENDIF.

DATA lt_data TYPE TABLE OF ytr_attach_files.
DATA ls_data LIKE LINE OF lt_data.

CLEAR lt_data.

“==========================================================
” Delete the record from attachment list
“==========================================================
LOOP AT lt_elements INTO lo_element.
    lo_element->get_static_attributes(
      IMPORTING
        static_attributes = ls_attach_list
    ).
    ” delete from the context node
    lo_node->remove_element( element = lo_element ).

    “Check if record exists in table
    IF ls_attach_list-status = abap_true.
      CLEAR ls_data.
      MOVE-CORRESPONDING ls_attach_list TO ls_data.

APPEND ls_data TO lt_data.

ENDIF.
ENDLOOP.

“==========================================================
” Delete the record(s) from data base table
“==========================================================
DELETE ytr_attach_files FROM TABLE lt_data.
ENDMETHOD.

Step 11:

Go to method WDDOINIT( ) of view and add the below code ( Retrieve functionality )

WDDOINIT
METHOD wddoinit . DATA lo_nd_attachment_list TYPE REF TO if_wd_context_node. DATA lt_attachment_list TYPE wd_this->elements_attachment_list. DATA ls_attachment_list LIKE LINE OF lt_attachment_list. DATA lt_data TYPE TABLE OF ytr_attach_files. FIELD-SYMBOLS: <ls_data> LIKE LINE OF lt_data. “========================================================== ” get the attachment files from table for the current user “========================================================== SELECT * INTO TABLE lt_data FROM ytr_attach_files WHERE uname = sy-uname. CLEAR lt_attachment_list. LOOP AT lt_data ASSIGNING <ls_data>. CLEAR ls_attachment_list. MOVE-CORRESPONDING <ls_data> TO ls_attachment_list. APPEND ls_attachment_list TO lt_attachment_list. ENDLOOP. “========================================================== ” Bind data to context node “========================================================== * navigate from <CONTEXT> to <ATTACHMENT_LIST> via lead selection lo_nd_attachment_list = wd_context->get_child_node( name = wd_this->wdctx_attachment_list ). lo_nd_attachment_list->bind_table( new_items = lt_attachment_list set_initial_elements = abap_true ). ENDMETHOD.

WDDOINIT

METHOD wddoinit .

DATA lo_nd_attachment_list TYPE REF TO if_wd_context_node.
DATA lt_attachment_list     TYPE wd_this->elements_attachment_list.
DATA ls_attachment_list     LIKE LINE OF lt_attachment_list.
DATA lt_data                TYPE TABLE OF ytr_attach_files.

FIELD-SYMBOLS: <ls_data> LIKE LINE OF lt_data.
“==========================================================
” get the attachment files from table for the current user
“==========================================================
SELECT *
    INTO TABLE lt_data
    FROM ytr_attach_files
    WHERE uname = sy-uname.

CLEAR lt_attachment_list.
LOOP AT lt_data ASSIGNING <ls_data>.
    CLEAR ls_attachment_list.
    MOVE-CORRESPONDING <ls_data> TO ls_attachment_list.
    APPEND ls_attachment_list TO lt_attachment_list.
ENDLOOP.

“==========================================================
” Bind data to context node
“==========================================================
* navigate from <CONTEXT> to <ATTACHMENT_LIST> via lead selection
lo_nd_attachment_list =
wd_context->get_child_node( name = wd_this->wdctx_attachment_list ).

lo_nd_attachment_list->bind_table( new_items = lt_attachment_list
set_initial_elements = abap_true ).

ENDMETHOD.

Save the component and active it

Step 12:

Create WDA application as below

Now, we are ready to see some output and the save, retrieve & delete functionality while attaching files

Output:

Click on BROWSE button as shown below

The choose file to upload wizard appears & choose a file and click on OPEN button as below

Click on attach button as shown below

Now, file is attached into table but it is not yet saved into database table ( see the highlighted cell )

Click on Save attachments button as show below (Now, the attachment is saved into data base .. see the highlighted cell )

The data is stored into data base table YTR_ATTACH_FILES as below

Again, browse another file and attach ( see the second row – for newly added file )

To delete an attachment, we need to select a row & click on “Delete attachment” button as show below

Note: on click delete attachment button, it deletes the attachment from data base as well ( if file is already stored )

Error messages:

If user clicks on save attachment button and no fresh attachment to save, then user will be notified with the below error message

If user clicks on Delete attachment button and no row has been selected (chosen), then user will be notified with below error message

—————————————————

Hope this document helps for those who are looking for uploading files and storing in table and retrieving 🙂

I appreciate if any comments/feedback from you 🙂 🙂 🙂

49 Comments

You must be Logged on to comment or reply to a post.

Vimal Sharma

January 10, 2014 at 9:59 am

Good One. Thanks Rama

Ramakrishnappa Gangappa

Blog Post Author

January 10, 2014 at 10:59 am

Thanks Vimal... 🙂 hope this helps you...

Sahir Nidagundi

January 11, 2014 at 7:22 am

Thanks for sharing.

Ramakrishnappa Gangappa

Blog Post Author

January 11, 2014 at 9:25 am

Thank you Sahir 🙂

Vimal Sharma

January 16, 2014 at 7:09 am

Hi Rama,

In step no. 8,You have binded Data property to which attribute of node Attachment_List. ?

Thanks,

Vimal

Ramakrishnappa Gangappa

Blog Post Author

January 16, 2014 at 7:22 am

Hi Vimal,

Sorry, the image was not clear. I have updated new image at step 8.

Please check now.

Regards,

Rama

Syam Babu

January 16, 2014 at 7:22 am

Brilliant Blog Ramakrishna.

Thanks,

Syam

Ramakrishnappa Gangappa

Blog Post Author

January 16, 2014 at 7:26 am

Thank you Syam 🙂

I am glad if its useful

Vimal Sharma

January 16, 2014 at 9:18 am

Hi Rama,

I am able to design this application successfully.But i have a question,Now suppose ABAPer's want to access this file,So how can they access it in same format.

ABAPer's want to save this attached file to some standard TCODE. How can they do this ?

We have simply used select statements and binded the data and we are able to download the file.But how the same thing is possible in ABAP.is there any FM ?

Can you help on this?

Ramakrishnappa Gangappa

Blog Post Author

January 17, 2014 at 1:39 am

Hi Vimal,

Thats good, you are able to create this application successfully 🙂

There are many scn threads available to attach files in abap.

Please refer the methods in the class CL_GUI_FRONTEND_SERVICES.

Here you can use methods to read files/content and you can save into table as we did here.

Hope this helps you.

Regards,

Rama

Former Member

January 16, 2014 at 7:56 pm

Nice and clear document. I am working on similar requirement , here I need to attach .Txt/.msg/.xls/.docx too . In one of your screenshots above, .txt is in false state.

any work around?

Ramakrishnappa Gangappa

Blog Post Author

January 17, 2014 at 1:18 am

Hi Mohinder,

We can attach all types of files with this application.

The status " false" indicates that the file is not yet saved into database table ( just attached but not pressed SAVE button 🙂 ).

Please refer the below snap shot - where all types of files have been attached and saved into data base.

Former Member

January 17, 2014 at 4:22 pm

Hi Rama,

Indeed a nice explanation of document, very neatly done. I tried approach mentioned abovve, however CL_SYSTEM_UUID doesnt exist in below EHP6.

Thanks

Mohinder

Ramakrishnappa Gangappa

Blog Post Author

January 17, 2014 at 4:32 pm

Hi Mohinder,

Thank you 🙂 : I appreciate your ratings for this document 😎

The class CL_SYSTEM_UUID is used just to create a unique key.

You can create GUID by using FM: GUID_CREATE.

Use GUID22 from this FM.

Regards,

Rama

Former Member

January 17, 2014 at 9:16 pm

Hi Rama,

Thanks for clarification. I followed exactly same steps , but when I click to link I get below

pop-up. Whats wrong I am doing here? This happened when I tried earlier also, then thought of following your code but same error.

Ramakrishnappa Gangappa

Blog Post Author

January 18, 2014 at 8:16 am

Hi Mohinder,

This dialog box is asking the user for options to choose while downloading a file.

If you don't want to see again, please un-check the check box "Always ask before opening this type of file".

Regards,

Rama

Former Member

January 18, 2014 at 2:50 pm

Hi Rama,

Thanks for the info,however I understand this pop up I can disable anytime but if you see ~wd_key.htm , is the name of folder and it wouldnt open any documents, this document is in .htm format and doesnt open any files. Only PDFs, .PNG opens any ways thanks for help.

Thanks

Mohinder

Vimal Sharma

January 20, 2014 at 9:16 am

Hi Mohinder,

Please bind following properties on UI element File Download

i) Data

ii)File Name

iii)File Type

and your file will be able to get downloaded in any format.

Thanks,

Vimal Sharma

Former Member

January 18, 2014 at 5:56 am

Ramakrishnappa Gangappa

Blog Post Author

January 18, 2014 at 8:14 am

Thank you Katrice 🙂 .. I am happy if its useful.

Your feedback and ratings motive me ,,, to go ahead 🙂

Former Member

January 18, 2014 at 11:34 am

Hi Rama,

One of the most useful doc.

Thanks for sharing 🙂

But can u explain me how to view the attached document.

In your screen you have kept the file name as link to action. By clicking on it will it open the attached file???

Pls let me know how to view the attached file?

Thanks,

Nalla B.

Ramakrishnappa Gangappa

Blog Post Author

January 18, 2014 at 2:21 pm

Hi Nalla,

Thank you 🙂 I appreciate your feedback and ratings on this document.

Let me answer your question :

Here, I have used FileDownload ui element in the table. Hence you are able to see the link under file name. As we all know, on click on fileDownload ui element, we can either see or save the files.

Regards,

Rama

Former Member

January 19, 2014 at 5:44 am

Hi Rama,

Could you pls share the code for the file download options used in this application.

It will be very much useful. 🙂

Thanks

Nalla B.

Ramakrishnappa Gangappa

Blog Post Author

January 20, 2014 at 3:00 am

Hi Nalla,

I haven't written any code to download the files. Its the feature of FileDownload ui element that, as you click on link, user is allowd to open or save file.

Regards,

Rama

Shanthan Reddy

January 20, 2014 at 5:04 am

Hi Rama

Very useful thanks for sharing...

Ramakrishnappa Gangappa

Blog Post Author

January 20, 2014 at 6:33 am

Thank you Shanthan 🙂

Narasimha Rao

February 13, 2014 at 2:41 pm

Hi Ramakrishnappa,

thank you for sharing. The way you exaplained is good. Keep it up 🙂

Best regards,

Rao.

Ramakrishnappa Gangappa

Blog Post Author

February 13, 2014 at 2:43 pm

Thanks a lot Rao 🙂 I am glad if its useful.

Regards,

Rama

Priyesh Shah

March 10, 2014 at 8:13 am

Hi,

Good Tutorial on File Attachments.

Any Possibility integration of Document Server.

Best Regards,

Priyesh Shah

Ramakrishnappa Gangappa

Blog Post Author

March 11, 2014 at 2:07 am

Thank you Priyesh 🙂

Yes, we can attach files to GOS instead of custom table with the amendment in the updation / ratrieving logic.

Regards,

Rama

Priyesh Shah

March 11, 2014 at 10:20 am

Hi Ramakrishna,

You mean to say in WebDynpro ABAP we can use GOS objects.

How?

Best Regards

Priyesh Shah

Ramakrishnappa Gangappa

Blog Post Author

March 12, 2014 at 7:14 am

Yes we can attach files to GOS in WDA.

Please refer the below document

Attach files to GOS with Save, Retrieve, Delete functionality in SAP Web Dynpro ABAP - Part 1

Regards,

Rama

Former Member

April 1, 2014 at 12:25 pm

Thank you very much Rama for sharing.

I started to work in Webdynpro. It is very helpful for me 🙂

Ramakrishnappa Gangappa

Blog Post Author

April 1, 2014 at 1:34 pm

Thank you Sangeetha 🙂 I appreciate your feedback and I am glad that it is helpful for you 😎

Welcome to WD world ... keep exploring the documents under this section and all the best !!!

Regards,

Rama

Siva kumar Devana

May 5, 2014 at 12:15 pm

Hi Ramakrishnaappa,

This is very useful information.

Thanks for sharing.

Regards,

Siva kumar.

Ramakrishnappa Gangappa

Blog Post Author

May 8, 2014 at 3:08 am

Thank you Siva 🙂

Regards,

Rama

Former Member

October 13, 2014 at 7:38 am

Hi Rama,

I have done the same and got the things working but I am not getting the colour in column. I guess the colour coding is missing here. kindly help on the same.

Ramakrishnappa Gangappa

Blog Post Author

October 13, 2014 at 8:28 am

Hi,

Thanks for following the document in detail 🙂

Ooops, that is missed,

To set color to column--->

Select the table column and set the cell design property as required.

Regards,

Rama

Tashi Norbu

October 13, 2014 at 9:41 am

Hi Rama,

Havent tried yet, but content is definitely useful(gonna use when oppoprtunity comes) .. Thanks for sharing.

Regards,

Tashi

Ramakrishnappa Gangappa

Blog Post Author

October 14, 2014 at 2:52 am

Thank you Tashi 🙂

Regards,

Rama

Former Member

October 14, 2014 at 9:55 am

Hi Rama!

I like the work done here!

A simple idea : you could provide the save/retrieve/delete methods as interface so that the component could be used by anyone and the files stored in everyone own personnal data storage (like SAP BDS or PM attached doc or else...) just by implementing this interface.

Then with sap link (for example) provide a nice tool for the community! 🙂

Kind regards,

(if you need help for this do not hesitate! 😉 )

Ramakrishnappa Gangappa

Blog Post Author

October 14, 2014 at 4:09 pm

Hi Giraud,

Thank you for your comments 🙂

I too liked your Idea but here in this document I have written the business logic inside component ( to minimize the documentation steps 😉 ) just for DEMO purpose. It should be separated into a class/interface implementation.

Any way I will try to provide component & class using sap link program ASAP.

Regards,

Rama

Former Member

October 14, 2014 at 2:09 pm

Hi Rama,

Great effort in writing the blog. To be honest i have not seen a customer asking to store documents in DB when there are better solutions available like kM, content server. DMS. Such solutions have better file management and archiving mechanisms rather than storing the files in traditional DB.

Integration with KM, content server, and DMS are all available. This woud be my last solution.

Ashish

Former Member

October 14, 2014 at 2:49 pm

" To be honest i have not seen a customer asking to store documents in DB"

Been there!!

That's why the interface solution can enable user case free adaptation of the component as suggested in a previous comment ^^

Ramakrishnappa Gangappa

Blog Post Author

October 14, 2014 at 4:17 pm

Hi Ashish,

Thanks for your comments 🙂

"To be honest i have not seen a customer asking to store documents in DB"

May be you have not come across such customers 😉 ... just kidding.

Agree with you that to suggest the customers for km, content server, dms etc. But here, I just explained possible option with DB, may be its useful if customers insists for this kind of approach.

Please refer my other document, which explains about attaching documents to GOS.

Attach files to GOS with Save, Retrieve, Delete functionality in SAP Web Dynpro ABAP - Part 1

Regards,

Rama

Former Member

April 10, 2015 at 9:48 am

Hi Rama,

the thread is so useful and clearly explained,Kudos for the thread.It helped me in solving the uploading of the attachments but I am unable to download the uploaded file using Download UI element in table.As no text is displaying in that column. As earlier you said that there is an issue with 7.30 the same i am facing but I solved the issue of binding the file download UI element and i am unable to bind the data source of the table to the Raw string of the table.Can u please help me in this.

1.Error while binding the file

2.File Name is not displaying once uploaded

Ramakrishnappa Gangappa

Blog Post Author

April 10, 2015 at 11:53 am

Hi Rohith,

Thank you for your feedback.

To resolve your issue, follow the below steps

Go to node UPLOAD_LIST and remove the dictionary type used for the node
Now, change the type of attribute FILE_DATA to XSTRING
Bind to the property "data" of file download ui element

Hope this solves your issue.

Regards,

Rama

Former Member

April 10, 2015 at 1:26 pm

Thank You Rama,

Issue Resolved.Thanks for your Quick response.

Ruta Londhe

October 18, 2019 at 3:45 pm

Hello Rama,

I know that this a very old thread. Yet I am writing in this thread with a hope that I would get some help. 🙂

My requirment here is a bit different.

For my Web dynpro application I have created a transaction.

User is using this transaction in which now they want this FILE_UPLOAD functionality.

This functionality works in browser but when executed using transaction, Browse is not working

Request your help here. How can I fix this? It's really very important requirement for us.

Regards,

Ruta

Attach files with save, retrieve and delete functionality in Web Dynpro ABAP – Part 2

Assigned Tags