The Four Types of Popup Window
Overview
Interface IF_WD_WINDOW_MANAGER provides four methods for creating a secondary window in a Web Dynpro ABAP component. These methods may be used to open a modal dialog window with simple text or content from a Web Dynpro view or open an independent browser window with a URL address. Each method is discussed below and an example is given of its implementation.
Jump to:
CREATE_EXTERNAL_WINDOW | Creates an independent, external browser window with URL address. |
CREATE_POPUP_TO_CONFIRM | Creates a modal dialog window for displaying a simple text message with optional icon. |
CREATE_WINDOW | Creates a modal dialog window for displaying an interface view of the current component. |
CREATE_WINDOW_FOR_CMP_USAGE | Creates a modal dialog window for displaying an interface view of a component usage. |
1.0 CREATE_EXTERNAL_WINDOW
This method creates an independent, external browser window with URL address. It may be used to open a secondary browser window containing a different web application or an internet website.
Procedure
1.1 Create a Web Dynpro Component
Create a Web Dynpro component, ZDEMO_POPUPS with a view, V_MAIN and window, W_MAIN. Also create an application for the component.
1.2 Create a Window Attribute
In the component controller, create a public attribute WINDOW to store a reference to the popup window object. Having a reference available as a public attribute enables us to access and control the popup window from any view.
1.3 Create a LinkToAction with Event Handler
In the layout of view V_MAIN, create a LinkToAction element with the following properties.
Properties (LinkToAction) | |
---|---|
ID | CREATE_EXTERNAL_WINDOW |
text | CREATE_EXTERNAL_WINDOW |
Events | |
onAction | POPUP_EXTERN_WINDOW |
1.4 Implement Event Handler POPUP_EXTERN_WINDOW
Implement the event handler method for the LinkToAction element as follows.
METHOD onactionpopup_extern_window.
DATA lo_api_component TYPE REF TO if_wd_component.
DATA lo_window_manager TYPE REF TO if_wd_window_manager.
* Get the window manager
lo_api_component = wd_comp_controller->wd_get_api( ).
lo_window_manager = lo_api_component->get_window_manager( ).
* Create the external window
wd_comp_controller->window = lo_window_manager->create_external_window(
url = 'http://scn.sap.com'
title = 'CREATE_EXTERNAL_WINDOW Example'
modal = abap_false
has_menubar = abap_true
is_resizable = abap_true
has_scrollbars = abap_true
has_statusbar = abap_true
has_toolbar = abap_true
has_location = abap_true
use_post = abap_false
).
* Open the external window
wd_comp_controller->window->open( ).
ENDMETHOD.
1.5 Run the Application
Save, activate and run the Web Dynpro application. Clicking the link CREATE_EXTERNAL_WINDOW opens a new browser window showing the specified web address.
2.0 CREATE_POPUP_TO_CONFIRM
This method creates a modal dialog window for displaying a simple text message with optional icon. With this method, there is no need to specify an interface view to contain the text message; the interface view is provided by the runtime.
Procedure
2.1 Create a LinkToAction with Event Handler
Repeat steps 1.1 Create a Web Dynpro Component and 1.2 Create a Window Attribute of section CREATE_EXTERNAL_WINDOW to create a new Web Dynpro component and window attribute, or skip these steps and extend the component created in section CREATE_EXTERNAL_WINDOW.
In the layout of view V_MAIN, create a LinkToAction element with the following properties.
Properties (LinkToAction) | |
---|---|
ID | CREATE_POPUP_TO_CONFIRM |
text | CREATE_POPUP_TO_CONFIRM |
Events | |
onAction | POPUP_TO_CONFIRM |
2.2 [OPTIONAL] Implement an Event Handler Method for Button Click Events
This step is only needed if you want to subscribe to button click events in the confirmation popup window.
In view V_MAIN, create an event handler method POPUP_TO_CONFIRM_EVENT_HANDLER and implement it as follows. An event handler might be used, for example, to update the context according to the user’s response in the confirmation popup window.
METHOD popup_to_confirm_event_handler.
* Handle the button click event as needed
CASE wdevent->name.
WHEN if_wd_popup_to_confirm_n=>co_popup_button_event-on_yes.
WHEN if_wd_popup_to_confirm_n=>co_popup_button_event-on_no.
WHEN if_wd_popup_to_confirm_n=>co_popup_button_event-on_abort.
WHEN if_wd_popup_to_confirm_n=>co_popup_button_event-on_cancel.
WHEN if_wd_popup_to_confirm_n=>co_popup_button_event-on_retry.
WHEN if_wd_popup_to_confirm_n=>co_popup_button_event-on_ignore.
WHEN if_wd_popup_to_confirm_n=>co_popup_button_event-on_close.
WHEN if_wd_popup_to_confirm_n=>co_popup_button_event-on_ok.
ENDCASE.
ENDMETHOD.
2.3 Implement Event Handler POPUP_TO_CONFIRM
Parameter BUTTON_KIND of method CREATE_POPUP_TO_CONFIRM enables you to specify a set of buttons for the confirmation popup window. The possible values for this parameter are as follows.
Button Set | Buttons in the Set |
---|---|
IF_WD_WINDOW=>CO_BUTTONS_ABORTRETRYIGNORE |
IF_WD_WINDOW=>CO_BUTTON_ABORT IF_WD_WINDOW=>CO_BUTTON_RETRY IF_WD_WINDOW=>CO_BUTTON_IGNORE |
IF_WD_WINDOW=>CO_BUTTONS_CLOSE |
IF_WD_WINDOW=>CO_BUTTON_CLOSE |
IF_WD_WINDOW=>CO_BUTTONS_NONE |
IF_WD_WINDOW=>CO_BUTTON_NONE |
IF_WD_WINDOW=>CO_BUTTONS_OK | IF_WD_WINDOW=>CO_BUTTON_OK |
IF_WD_WINDOW=>CO_BUTTONS_OKCANCEL |
IF_WD_WINDOW=>CO_BUTTON_OK IF_WD_WINDOW=>CO_BUTTON_CANCEL |
IF_WD_WINDOW=>CO_BUTTONS_YESNO |
IF_WD_WINDOW=>CO_BUTTON_YES IF_WD_WINDOW=>CO_BUTTON_NO |
IF_WD_WINDOW=>CO_BUTTONS_YESNOCANCEL |
IF_WD_WINDOW=>CO_BUTTON_YES IF_WD_WINDOW=>CO_BUTTON_NO IF_WD_WINDOW=>CO_BUTTON_CANCEL |
Parameter MESSAGE_TYPE of method CREATE_POPUP_TO_CONFIRM enables you to specify an icon for the confirmation popup window. The possible values for this parameter are as follows.
Implement the event handler method for the LinkToAction element as follows. Lines 24 through 46 subscribe to button click events within the confirmation popup window. These lines should only be included if you implemented the event handler for button click events in Step 2.2.
METHOD onactionpopup_to_confirm.
DATA lo_api_component TYPE REF TO if_wd_component.
DATA lo_window_manager TYPE REF TO if_wd_window_manager.
DATA lo_api_v_main TYPE REF TO if_wd_view_controller.
DATA lt_string_table TYPE string_table.
* Get the window manager
lo_api_component = wd_comp_controller->wd_get_api( ).
lo_window_manager = lo_api_component->get_window_manager( ).
* Create the popup window
APPEND 'Have a nice day!' TO lt_string_table.
wd_comp_controller->window = lo_window_manager->create_popup_to_confirm(
text = lt_string_table
button_kind = if_wd_window=>co_buttons_okcancel
message_type = if_wd_window=>co_msg_type_information
close_button = abap_true
window_title = 'CREATE_POPUP_TO_CONFIRM Example'
default_button = if_wd_window=>co_button_ok
). * Get the view controller
lo_api_v_main = wd_this->wd_get_api( ).
* Subscribe to button events in the popup window
TRY.
* OK button
wd_comp_controller->window->popup_to_confirm->subscribe_to_button_event(
controller = lo_api_v_main
handler_name = 'POPUP_TO_CONFIRM_EVENT_HANDLER'
button = if_wd_window=>co_button_ok
).
CATCH cx_wdr_rt_exception.
ENDTRY.
TRY.
* CANCEL button
wd_comp_controller->window->popup_to_confirm->subscribe_to_button_event(
controller = lo_api_v_main
handler_name = 'POPUP_TO_CONFIRM_EVENT_HANDLER'
button = if_wd_window=>co_button_cancel
).
CATCH cx_wdr_rt_exception.
ENDTRY.
* Open the popup window
wd_comp_controller->window->open( ).
ENDMETHOD.
2.4 Run the Application
Save, activate and run the Web Dynpro application. Clicking the link CREATE_POPUP_TO_CONFIRM opens a confirmation popup window. If the user closes the popup window by means of either the OK or Cancel buttons, the button click event is captured by method POPUP_TO_CONFIRM_EVENT_HANDLER.
3.0 CREATE_WINDOW
This method creates a modal dialog window for displaying an interface view of the current component. Since the view displayed belongs to the current component, the developer has full control over the popup window’s content and behavior.
Procedure
3.1 Create a View and Window for the Popup
Repeat steps 1.1 Create a Web Dynpro Component and 1.2 Create a Window Attribute of section CREATE_EXTERNAL_WINDOW to create a new Web Dynpro component and window attribute, or skip these steps and extend the component created in section CREATE_EXTERNAL_WINDOW.
Add a new view V_POPUP and a new window W_POPUP to the component, and embed view V_POPUP into window W_POPUP.
3.2 Create a LinkToAction with Event Handler
In the layout of view V_MAIN, create a LinkToAction element with the following properties.
Properties (LinkToAction) | |
---|---|
ID | CREATE_WINDOW |
text | CREATE_WINDOW |
Events | |
onAction | POPUP_WINDOW |
3.3 Implement Event Handler POPUP_WINDOW
Parameter BUTTON_KIND of method CREATE_WINDOW enables you to specify a set of buttons for the confirmation popup window. The possible values for this parameter are as follows.
Button Set | Buttons in the Set |
---|---|
IF_WD_WINDOW=>CO_BUTTONS_ABORTRETRYIGNORE |
IF_WD_WINDOW=>CO_BUTTON_ABORT IF_WD_WINDOW=>CO_BUTTON_RETRY IF_WD_WINDOW=>CO_BUTTON_IGNORE |
IF_WD_WINDOW=>CO_BUTTONS_CLOSE |
IF_WD_WINDOW=>CO_BUTTON_CLOSE |
IF_WD_WINDOW=>CO_BUTTONS_NONE |
IF_WD_WINDOW=>CO_BUTTON_NONE |
IF_WD_WINDOW=>CO_BUTTONS_OK | IF_WD_WINDOW=>CO_BUTTON_OK |
IF_WD_WINDOW=>CO_BUTTONS_OKCANCEL |
IF_WD_WINDOW=>CO_BUTTON_OK IF_WD_WINDOW=>CO_BUTTON_CANCEL |
IF_WD_WINDOW=>CO_BUTTONS_YESNO |
IF_WD_WINDOW=>CO_BUTTON_YES IF_WD_WINDOW=>CO_BUTTON_NO |
IF_WD_WINDOW=>CO_BUTTONS_YESNOCANCEL |
IF_WD_WINDOW=>CO_BUTTON_YES IF_WD_WINDOW=>CO_BUTTON_NO IF_WD_WINDOW=>CO_BUTTON_CANCEL |
Parameter MESSAGE_TYPE of method CREATE_WINDOW enables you to specify an icon for the confirmation popup window. The possible values for this parameter are as follows.
Implement the event handler method for the LinkToAction element as follows.
METHOD onactionpopup_window.
DATA lo_api_component TYPE REF TO if_wd_component.
DATA lo_window_manager TYPE REF TO if_wd_window_manager.
* Get the window manager
lo_api_component = wd_comp_controller->wd_get_api( ).
lo_window_manager = lo_api_component->get_window_manager( ).
* Create the popup window
wd_comp_controller->window = lo_window_manager->create_window(
window_name = 'W_POPUP'
title = 'CREATE_WINDOW Example'
close_in_any_case = abap_true
message_display_mode = if_wd_window=>co_msg_display_mode_selected
close_button = abap_true
button_kind = if_wd_window=>co_buttons_abortretryignore
message_type = if_wd_window=>co_msg_type_none
default_button = if_wd_window=>co_button_ignore
).
* Open the popup window
wd_comp_controller->window->open( ).
ENDMETHOD.
3.4 Give View V_POPUP Some Content
Since it is local to the current component, you have full control over the popup window’s content and behavior. In this example, we will keep it simple. In the layout of view V_POPUP, create a TextView element with the following properties.
Properties (TextView) | |
---|---|
ID | LOCKED_MESSAGE |
text | The record you attempted to update is locked by another user. |
3.5 [OPTIONAL] Implement an Action and Handler Method for Button Click Events
This step is only needed if you want to subscribe to button click events in the popup window.
In the layout of view V_POPUP, create an action POPUP_ACTION and implement its handler method as follows. An action might be used, for example, to update the context according to the user’s response in the popup window.
METHOD onactionpopup_action.
FIELD-SYMBOLS <param> TYPE wdr_event_parameter.
FIELD-SYMBOLS <button> TYPE wdr_value.
* Determine which button in the popup the user clicked
READ TABLE wdevent->parameters ASSIGNING <param>
WITH KEY name = 'BUTTON'.
CHECK sy-subrc IS INITIAL.
* Dereference the parameter value to identify the button
ASSIGN <param>-value->* TO <button>.
* Handle the button click as needed
CASE <button>.
WHEN if_wd_window=>co_button_none.
WHEN if_wd_window=>co_button_abort.
WHEN if_wd_window=>co_button_retry.
WHEN if_wd_window=>co_button_ignore.
WHEN if_wd_window=>co_button_ok.
WHEN if_wd_window=>co_button_close.
WHEN if_wd_window=>co_button_cancel.
WHEN if_wd_window=>co_button_yes.
WHEN if_wd_window=>co_button_no.
ENDCASE.
ENDMETHOD.
3.6 [OPTIONAL] Subscribe to Button Click Events
This step is only needed if you want to subscribe to button click events in the popup window.
In hook method WDDOINIT of view V_POPUP, subscribe to desired button click events.
METHOD wddoinit.
DATA lo_api_v_popup TYPE REF TO if_wd_view_controller.
* Get the view controller
lo_api_v_popup = wd_this->wd_get_api( ).
* Subscribe to button events in the popup window
TRY.
* OK button
wd_comp_controller->window->subscribe_to_button_event(
button = if_wd_window=>co_button_ok
action_name = 'POPUP_ACTION'
action_view = lo_api_v_popup
).
CATCH cx_wdr_rt_exception.
ENDTRY.
TRY.
* CLOSE button
wd_comp_controller->window->subscribe_to_button_event(
button = if_wd_window=>co_button_close
action_name = 'POPUP_ACTION'
action_view = lo_api_v_popup
).
CATCH cx_wdr_rt_exception.
ENDTRY.
TRY.
* CANCEL button
wd_comp_controller->window->subscribe_to_button_event(
button = if_wd_window=>co_button_cancel
action_name = 'POPUP_ACTION'
action_view = lo_api_v_popup
).
CATCH cx_wdr_rt_exception.
ENDTRY.
TRY.
* YES button
wd_comp_controller->window->subscribe_to_button_event(
button = if_wd_window=>co_button_yes
action_name = 'POPUP_ACTION'
action_view = lo_api_v_popup
).
CATCH cx_wdr_rt_exception.
ENDTRY.
TRY.
* NO button
wd_comp_controller->window->subscribe_to_button_event(
button = if_wd_window=>co_button_no
action_name = 'POPUP_ACTION'
action_view = lo_api_v_popup
).
CATCH cx_wdr_rt_exception.
ENDTRY.
TRY.
* ABORT button
wd_comp_controller->window->subscribe_to_button_event(
button = if_wd_window=>co_button_abort
action_name = 'POPUP_ACTION'
action_view = lo_api_v_popup
).
CATCH cx_wdr_rt_exception.
ENDTRY.
TRY.
* RETRY button
wd_comp_controller->window->subscribe_to_button_event(
button = if_wd_window=>co_button_retry
action_name = 'POPUP_ACTION'
action_view = lo_api_v_popup
).
CATCH cx_wdr_rt_exception.
ENDTRY.
TRY.
* IGNORE button
wd_comp_controller->window->subscribe_to_button_event(
button = if_wd_window=>co_button_ignore
action_name = 'POPUP_ACTION'
action_view = lo_api_v_popup
).
CATCH cx_wdr_rt_exception.
ENDTRY.
ENDMETHOD.
3.7 Run the Application
Save, activate and run the Web Dynpro application. Clicking the link CREATE_WINDOW opens a popup window displaying view V_POPUP. If the user closes the popup window by means of either the Cancel, Repeat or Ignore buttons, the button click event is captured by action POPUP_ACTION.
4.0 CREATE_WINDOW_FOR_CMP_USAGE
This method creates a modal dialog window for displaying an interface view of a component usage.
Procedure
4.1 Create a Component Usage
Repeat steps 1.1 Create a Web Dynpro Component and 1.2 Create a Window Attribute of section CREATE_EXTERNAL_WINDOW to create a new Web Dynpro component and window attribute, or skip these steps and extend the component created in section CREATE_EXTERNAL_WINDOW.
Add a component usage to the component ZDEMO_POPUPS. In this example, we use a component developed for another walk-through tutorial, ZDEMO_ALV.
Also add the component usage to view V_MAIN.
4.2 Create a LinkToAction with Event Handler
In the layout of view V_MAIN, create a LinkToAction element with the following properties.
Properties (LinkToAction) | |
---|---|
ID | CREATE_WINDOW_FOR_CMP_USAGE |
text | CREATE_WINDOW_FOR_CMP_USAGE |
Events | |
onAction | POPUP_CMP_USAGE |
4.3 Implement Event Handler POPUP_CMP_USAGE
Implement the event handler method for the LinkToAction element as follows. Parameter INTERFACE_VIEW_NAME of method CREATE_WINDOW_FOR_CMP_USAGE is the name of the used component’s interface view, i.e., its window.
METHOD onactionpopup_cmp_usage.
DATA lo_api_component TYPE REF TO if_wd_component.
DATA lo_window_manager TYPE REF TO if_wd_window_manager.
* Get the window manager
lo_api_component = wd_comp_controller->wd_get_api( ).
lo_window_manager = lo_api_component->get_window_manager( ).
* Create the popup window for component usage
wd_comp_controller->window = lo_window_manager->create_window_for_cmp_usage(
interface_view_name = 'WINDOW'
component_usage_name = 'CMP_USAGE_ALV'
title = 'CREATE_WINDOW_FOR_CMP_USAGE Example'
close_in_any_case = abap_true
message_display_mode = if_wd_window=>co_msg_display_mode_selected
is_resizable = abap_true
).
* Open the popup window for component usage
wd_comp_controller->window->open( ).
ENDMETHOD.
4.4 Run the Application
Save, activate and run the Web Dynpro application. Clicking the link CREATE_WINDOW_FOR_CMP_USAGE opens a popup window displaying the contents of the component usage interface view.
Hi Amy,
Very useful blog.
Thanks
Katrice
Hi Amy,
Nice and detailed document. Appreciate your effort 🙂 Keep going ahead.!
Cheers,
Kiran
Nice and useful blog...
Hi amy,
Thanks for sharing knowledge. Nice blog.
Thanks
Vijay
Very Informative...Many Thanks.
Best Regards,
Naresh K.
Thanks for sharing knowledge. nice document. Keep going ahead. 😉
very helpful information ,Thanks a lot.
hi amy..
usefull blog thax.
Best Regards,
Amar
simple and useful info Amy King
Hi Amy,
Its very nice and detailed content. keep posting. 🙂
Very Helpful.
Thanks AMY, For sharing such a nice blog!!!!.
Thanks Amy, Is there any way to attach multiple URL in external window
I'm not sure what scenario you're thinking of, but an external window is intended for a single URL destination--just like this web page you're reading now points to a single URL address.
If you want to display to the user a list of links which they could click, you could create a view which displays those links and open the view as a popup.
I hope that helps.
Thanks Amy. My scenario is; currently system is downloading a file from SAP server by adding the URL in external window. I am looking to download multiple URLs from server.
It sounds like what you are looking for is the FileDownload UI Element though this UI element is intended to download a single file. I don't believe Web Dynpro offers a UI element to download multiple, separate files with just one click which is what I think you're looking for.