SAP Tech Pro

SAP Technical Blog
Topprice Price Comparison

How to use “File Upload” in Web Dynpro with static and dynamic programming

How to use “File Upload” in Web Dynpro with static and dynamic programming

We can use this UI element to upload a file from the client to the server. Hereunder,we present a list with some of the FileUpload properties that can be bound,and the attribute type in case the property is bindable (Table).

How to use “File Upload” in Web Dynpro with static and dynamic programming

We create a very simple example – uploading to the server a text file that contains the numbers from 1 to 10 and then displaying the file content in a browser window.Figure shows the structure of the test.txt file created on the Desktop by using Notepad.

File structure

How to use “File Upload” in Web Dynpro with static and dynamic programming

We create a WD Component with a view named V_VIEW.In the view context,we create four attributes: FILECONTENT of XSTRING type required to hold the file content,FILENAME of STRING type required to hold the name of the upload file,MIMETYPE of STRING type required to hold the mime type of the upload file and SIZE of INTEGER type required to hold the file size,in bytes.The WD component structure and the view context structure are presented in Fig.

WD component structure and view context structure

How to use “File Upload” in Web Dynpro with static and dynamic programming

Onto the view V_VIEW, we insert a FileUpload UI element.This UI element doesn’t have an action attached.To upload the file,we need to add an UI element from the action category, in our case a Button. As we have seen,the mandatory property of this UI element is DATA. For this UI element, we must realise a data binding to the attribute of XSTRING type (FILECONTENT).

View Layout

How to use “File Upload” in Web Dynpro with static and dynamic programming

The FileUpload UI element has an input field,where we have to write the directory path and the file name we want to upload to the server,and a button that offers the possibility to search for a file.In case we search for a file by using this button,the fully qualified path is written in the input field.

When the user presses the Upload button, the file content is loaded into the XSTRING attribute.With the help of the onactionupload event handler method,we calculate the file size by using the XSTRLEN length function. Listing showsthe structure of this method.

The onactionupload event handler method


METHOD onactionupload.

DATA lv_content TYPE xstring.

DATA lv_size TYPE i.

wd_context->get_attribute(EXPORTING name ='FILECONTENT'

IMPORTING value = lv_content).

lv_size = XSTRLEN(lv_content).

wd_context->set_attribute(name ='SIZE'value = lv_size).

ENDMETHOD.
 

When the user presses the Show button,the Framework triggers the event handler method onactionshow (Listing).

The onactionshow event handler method


METHOD onactionshow. 

DATA: lv_content TYPE xstring, 

lv_mimetype TYPE string, 

lv_size TYPE i, 

lv_filename TYPE string. 

wd_context->get_attribute(EXPORTING name ='FILECONTENT' 

IMPORTING value = lv_content). 

wd_context->get_attribute(EXPORTING name ='FILENAME' 

IMPORTING value = lv_filename). 

wd_context->get_attribute(EXPORTING name ='MIMETYPE' 

IMPORTING value = lv_mimetype). 

wd_context->get_attribute(EXPORTING name ='SIZE' 

IMPORTING value = lv_size ). 

cl_wd_runtime_services=>attach_file_to_response( 

i_filename = lv_filename 

i_content = lv_content 

i_mime_type = lv_mimetype 

i_in_new_window = abap_true 

i_inplace = abap_true). 

ENDMETHOD. 
 

As we can see,we have used the static public method.
ATTACH_FILE_TO_RESPONSE of the CL_WD_RUNTIME_SERVICES,required to add a file to a response. his method has the following parameters: I_FILENAME (the name of the file),I_CONTENT (the content of the file in XSTRING format),I_MIME_ TYPE(the mime type of the file),I_IN_NEW_WINDOW (parameter of Boolean type that specifies if the file content will be displayed in a new window) and I_INPLACE (of the same Boolean type).

By using the Delete button,we can delete the data from the context.In case we don’t delete these data,the file would be kept in the memory until a new file is uploaded or until we complete the application. The runtime structure is presented in Fig.

Dynamic Programming

RUNTIME CLASS: CL_WD_FILE_UPLOAD

Hereunder,we present a table showing the correspondence between the view designer name and the runtime name,with the proper types,in case of dynamic programming of a FileUpload UI element (Table).

Runtime

How to use “File Upload” in Web Dynpro with static and dynamic programming

clip_image012

The implementation of a dynamic FileUpload UI element contains the following statements(Listing):

Dynamic creation of a FileUpload UI element


DATA lr_file_upload TYPE REF TO cl_wd_file_upload. 

lr_file_upload = cl_wd_file_upload=>new_file_upload( 

id ='FILEUPLOAD' 

bind_data = 'FILECONTENT' 

bind_file_name ='FILENAME' 

bind_mime_type ='MIMETYPE' 

). 

Add comment

Before Buying, Compare Prices at Topprice.in

Topprice.in