Skip to Content
Author's profile photo Ramakrishnappa Gangappa
Ramakrishnappa Gangappa
Posted on January 10, 2014 4 minute read

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

Follow RSS feed
5 Likes 12,569 Views 10 Comments

Purpose:

Application for attaching files with save, retrieve & delete functionality in Webdynpro ABAP

Scenario:

I would like to explain the functionality of how to save,retrieve & delete files during attachments in Webdynpro ABAP application. It stores attached files in custom data base table.

Pre-requisite:

Basic knowledge of Webdynpro ABAP,& OO ABAP

Step by step Process

The process is divided as below

  • Create a custom table YTR_ATTACH_FILES to store files
  • Create a WDA component with save, retrieve & delete function

Note:
In this document, just for demo purpose the business logic of saving & retrieving data from data base table has written in WDA component.

Strictly the business logic should be separated from WDA component by using a model i.e. class, function module, etc.

(Refer MVC architecture in Architecture of Webdynpro for ABAP)

Create a transparent table YTR_ATTACH_FILES

Step 1.

Go to transaction code SE11 and enter database table name YTR_ATTACH_FILES as below

table0.PNG

Step 2:

Set the delivery & maintenance settings as below

table1.PNG

Step 3:

Go to technical settings and maintain the entries as below 

table2.PNG

Step 4:

Create the fields in table as below

table3.PNG

Create a Webdynpro ABAP component

Step1:

  Go to transaction code SE80 and create the Webdynpro ABAP component as below with a view V_MAIN as below

1.PNG

Step 2:

Go to the view context of view V_MAIN and create a node INPUT by using table name YTR_ATTACH_FILES as below

v1.PNG

Step3:

Create a node ATTACHMENT_LIST by using table name YTR_ATTACH_FILES as below

v2.PNG

Step 4:

Create the layout by using context nodes INPUT & OUTPUT as below

v3.PNG

Choose the editors for table columns as suggested below

Technical_data_of_table.jpg

Step 5:

Create a ui element FILE_UPLOAD and bind the properties as shown below

v4.PNG

Step 6:

  Create a button BTN_ATTACH and attach an action ATTACH as below

v5.PNG

Add the below code into event handler method ONACTIONATTACH   (to attach a file into table)

ONACTIONATTACH

METHOD onactionattach .
  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.
  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 lv_temp                TYPE string.

  “==========================================================
  ” Read the details of file chosen for attachment
  “==========================================================
  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 ).

  ” return if nothing to do
  IF ls_input-file_data is INITIAL.
    ” Notify the user, please choose a file
    RETURN.
  ENDIF.

  “==========================================================
  ” Read the attachment list
  “==========================================================
* 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->get_static_attributes_table(
  IMPORTING table = lt_attachment_list ).

  “==========================================================
  ” Prepare data to save
  “==========================================================
  CLEAR ls_attachment_list.
  ls_attachment_list-mandt = sy-mandt.
  ls_attachment_list-uname = sy-uname.
  ” Generate Unique identifier
  TRY.
    ls_attachment_list-guid = cl_system_uuid=>create_uuid_c22_static( ).
    CATCH cx_uuid_error.  ” Error Class for UUID Processing Errors.
  ENDTRY.

  ls_attachment_list-file_data = ls_input-file_data.

  ” get file name from path
  WHILE ls_input-file_name CA ‘\’.
    SPLIT ls_input-file_name AT ‘\’
    INTO lv_temp ls_input-file_name.
  ENDWHILE.
  ls_attachment_list-file_name = ls_input-file_name.

  ls_attachment_list-file_type = ls_input-file_type.
  ls_attachment_list-erdat = sy-datum.
  ls_attachment_list-erzet = sy-timlo.
  ls_attachment_list-status = abap_false.”attachment is new

  APPEND ls_attachment_list TO lt_attachment_list.

  “==========================================================
  ” Bind data to context
  “==========================================================
  lo_nd_attachment_list->bind_table(
    EXPORTING
      new_items            =    lt_attachment_list
  ).

ENDMETHOD.

——————————————–

Continued………..

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

Assigned tags

Related Blog Posts

    Related Questions

      /
      table0.PNG
      table1.PNG
      table2.PNG
      table3.PNG
      1.PNG
      v1.PNG
      v2.PNG
      v3.PNG
      Technical_data_of_table.jpg
      v4.PNG
      v5.PNG
      10 Comments
      You must be Logged on to comment or reply to a post.
      • Author's profile photo Vimal Sharma
        Vimal Sharma

        When we are binding property “Data” to FILE_DATA of Input node on Upload UI. We get error that “Property Data is not type Compatible with context element FILE_DATA”. The data type in table for this is RAWSTRING.Is that is the reason ?

          • /
            Error1.JPG
            Error2.JPG
            Error3.JPG
            • Author's profile photo Ramakrishnappa Gangappa
              Ramakrishnappa Gangappa Post author

              Oh, there is an issue.

              It works fine in NW 7.31. I think you are not meeting this system requirement.

              Please change data type of your FILE_DATA to XSTRING in context node( don’t use table field reference ).

              While saving data pass this data to your table field of type RAWSTRING.

              Hope this resolves your issue.

              Regards,

              Rama

              • Author's profile photo Former Member
                Former Member

                Hi Ramakrishna,

                   Thanks for the Post,It helped me to solve one of my major requirement.

                            If I want to view the file again in the same format(means preview) how can i achieve this?

              • Author's profile photo Ramakrishnappa Gangappa
                Ramakrishnappa Gangappa Post author

                Hi Rohith,

                Good to hear that this document helped you.

                In the table there is file download ui element ( i.e. file name as hyper link ) click on that, so that you would be able to open it its original format.

                Regards,

                Rama

              • Author's profile photo Former Member
                Former Member

                Hi Ramakrishna,

                   Thanks for your replies so far.the issue had resolved.


                       I had a requirement to call a Custom Report in Webdynpro and show the output in Webdynpro by passing some values as input to the report(eg: vendor).

                        Can u please help me on this.

                Thanks

      • Author's profile photo Former Member
        Former Member

         

        Hello Ramakrishna,

        Can you please advise what is the type of element you used for TC_INPUT. I am trying with LayoutContainer and it is giving different ICON and also tried with other types which could not help me.

        Thanking you in Anticipation