Skip to Content

In this example, I will detail all the steps required to call a method of one ABAP WebDynpro application from within another ABAP WebDynpro application.  This demonstration differs from my last similar example in that it displays a popup window which is defined in the shared component.  The context of the main  component is also shared (Bound) and used to prepare texts for the screen popup. 

Part 1:

Step 1:  Create an ABAP WebDynpro component with a method to share with other WD apps.

ABAP DynPro Name: ZWD_CMP_SHARED_POPUPS

/wp-content/uploads/2013/04/p_205924.jpg

Step 2:  Create an attribute of the COMPONENTCONTROLLER called POPUP_WINDOW.

/wp-content/uploads/2013/04/p_205924.jpg

Then create a context node and attribute on the component controller context as follows:

/wp-content/uploads/2013/04/p_205924.jpg

*Make sure to select the check box “Interface Node” on the node attributes:

/wp-content/uploads/2013/04/p_205924.jpg

*Select STRING for the type of attribute for MSG_ONE

Step 3:  Create a new view called V_POPUP_OK and a new window called W_POPUP_OK.

Set Width (400px) and Height (300px) properties on the ROOTUIELEMENTCONTAINER of the View

Then embed the View onto the Window:

/wp-content/uploads/2013/04/p_205924.jpg

On the views context, drag (map) the node “NODE_ONE” from the component controller context to the view context:

/wp-content/uploads/2013/04/p_205924.jpg

On the layout of this view, create a TextView element and bind its text to the MSG_ONE attribute:

/wp-content/uploads/2013/04/p_205924.jpg

Step 4:  Create a method called POPUP_OK (check as Interface) on the Component Controller.

/wp-content/uploads/2013/04/p_205924.jpg

method popup_ok .

  data lo_window_manager type ref to if_wd_window_manager.
 
data lo_api_component  type ref to if_wd_component.
 
data lo_window         type ref to if_wd_window.
 
data current_action    type wdapi_action.

  lo_api_component  = wd_this->wd_get_api( ).
  lo_window_manager
= lo_api_component->get_window_manager( ).

  call method lo_window_manager->create_window
   
exporting
      window_name         
= ‘W_POPUP_OK’
     
title                = ‘Confirmation’
      message_display_mode
= if_wd_window=>co_msg_display_mode_selected
      close_in_any_case   
= abap_true
      button_kind         
= if_wd_window=>co_buttons_yesno
      message_type        
= if_wd_window=>co_msg_type_none
      default_button      
= if_wd_window=>co_button_no
      close_button        
= abap_false
      modal               
= abap_true
    receiving
     
window               = wd_this->popup_window.

  wd_this->popup_window->set_window_position( position = if_wd_window=>co_center ).
  wd_this
->popup_window->open( ).
  wd_this
->popup_window->subscribe_to_button_event(
                                     button
= if_wd_window=>co_button_yes
                                     action_name
= ‘YES’
                                     action_view
= lo_api ).
  wd_this
->popup_window->subscribe_to_button_event(
                                     button
= if_wd_window=>co_button_no
                                     action_name
= ‘NO’
                                     action_view
= lo_api ).

  free lo_window_manager.
 
if sysubrc ne 0.
 
endif.
 
free lo_api_component.
 
if sysubrc ne 0.
 
endif.

endmethod.

Step 5:  Create another ABAP WebDynpro application to call this shared popup.

/wp-content/uploads/2013/04/p_205924.jpg

On the Used Components tab, add an entry for your ZWD_CMP_SHARED_POPUPS component

/wp-content/uploads/2013/04/p_205924.jpg

Step 6:  In the main view, create a Component Usage for both the Shared Component and the Shared Component’s Interface Controller.

/wp-content/uploads/2013/04/p_205924.jpg

Select the context tab and you will see the context of the shared component controller’s context.  Drag (bind) the node “NODE_ONE” to your view as follows:

/wp-content/uploads/2013/04/p_205924.jpg

*This binding is possible because we made the node an “Interface Node”.

Step 7:  In the same main view, create two event handlers for the popup responses.

/wp-content/uploads/2013/04/p_205924.jpg

*you can choose your own code to add in these events (if any at all).

Step 8:  Add the following code to the hook method: WDDOINIT.

method wddoinit .


* Use the Wizard to Set a Value of MSG_ONE which the Popup will Display
 
data lo_nd_node_one type ref to if_wd_context_node.
 
data lo_el_node_one type ref to if_wd_context_element.
 
data ls_node_one type wd_this->element_node_one.
 
data lv_msg_one type wd_this->element_node_onemsg_one.

  lo_nd_node_one = wd_context->get_child_node( name = wd_this->wdctx_node_one ).
  lo_el_node_one
= lo_nd_node_one->get_element( ).
  lv_msg_one
= ‘Are You Sure You Wish To See The Houston Dynamo Play Soccer?’.
  lo_el_node_one
->set_attribute( name `MSG_ONE` value = lv_msg_one ).

* Use the Wizard to Instantiate the Used Component
 
data lo_cmp_usage type ref to if_wd_component_usage.
  lo_cmp_usage
= wd_this->wd_cpuse_zwd_cmp_shared_popups( ).
 
if lo_cmp_usage->has_active_component( ) is initial.
    lo_cmp_usage
->create_component( ).
 
endif.

* Use the Wizard to call the method of the Used Component
 
data lo_api type ref to if_wd_view_controller.
 
data lo_interfacecontroller type ref to ziwci_wd_cmp_shared_popups .
  lo_api
= wd_this->wd_get_api( ).
  lo_interfacecontroller
= wd_this->wd_cpifc_zwd_cmp_shared_popups( ).
  lo_interfacecontroller
->popup_ok( lo_api = lo_api ).

endmethod.

That’s it…  Test your application to see if it correctly calls the shared component and displays the popup and also displays the message you saved in the mapped context attribute. 

/wp-content/uploads/2013/04/p_205924.jpg

To report this post you need to login first.

1 Comment

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

Leave a Reply