Validation on pop up window - SAP Webdynpro ABAP

A+ A-

Purpose: 

 

Demonstrate the scenario of opening a pop up window and perform validation on UI fields in pop up window in WEB DYNPRO ABAP.

 

 

Pre-requisite:  Basic knowledge of ABAP Objects & Webdynpro ABAP is assumed

 

 

Here I consider explaining, how we can validate the fields on a popup window and display the
errors to user without closing window.

 

User T. Code - SE80 and create WD component YDEMO_POPUP with window W_MAIN, view V_MAIN as below

 

 

step1.png

 

 

Create global attribute GO_WINDOW on component controller to hold the reference of popup window which can be accessed across all views in
component

step2.png

Create ui elements page header & a button as below.Here BTN_POPUP is bound to an action POP_UP

step3.png

 

 

Logic to open a popup window :

 

 

Add the code in event handler ONACTIONPOP_UP as below.

 

 

  DATA lo_window_manager TYPE REF TO if_wd_window_manager.

 
DATA lo_api_component  TYPE REF TO if_wd_component.



  lo_api_component          
= wd_comp_controller->wd_get_api( ).

  lo_window_manager         
= lo_api_component->get_window_manager( ).

 

 
" Create window

 
CALL METHOD lo_window_manager->create_window(

   
EXPORTING

      window_name      
= 'W_POPUP'

     
title             = 'User Input'

      close_button     
= abap_true

      button_kind      
= 3 " Ok

      close_in_any_case
= abap_false

    RECEIVING

     
window            = wd_comp_controller->go_window

                         
).



 
" CHECK IF WINDOW REF BOUND

 
IF wd_comp_controller->go_window IS BOUND.

    wd_comp_controller
->go_window->open( ).

 
ENDIF.

 

 

 

 

Create a node INPUT with 2 attributes FIRST_NAME & LAST_NAME as below

step4.png

 

 

Create a view V_POPUP as below

 

step5.png

 

 

 

Map the node INPUT from component controller context to view context as below

 

step6.png

step6_2.png

 

 

 

Create container form from the context node INPUT  as below

step7.png

step7_2.png

 

 

Set the Property STATE of input fields to “REQUIRED” as below

 

step8.png

 

 

Create action “OK”  on view V_POPUP as below

 

step9.png

 

 

 

Logic to close the popup window:

 

 

Add the below code in the event handler ONACTIONOK of view
V_POPUP

 

 



 
" Close the window if now validation errors

 
IF wd_comp_controller->go_window IS BOUND.

    wd_comp_controller
->go_window->close( ).

 
ENDIF.

 

 

 

 

Logic to subscribe the button to an event on view:

 

 

Add the below code in the method WDDOINIT of view V_POPUP

 

 

" Subscribe to button event on popup window

 
IF wd_comp_controller->go_window IS BOUND.

    wd_comp_controller
->go_window->subscribe_to_button_event(

     
EXPORTING

        button           
= if_wd_window=>co_button_ok
*        button_text       =
*        tooltip           =

        action_name      
= 'OK'

        action_view      
= wd_this->wd_get_api( )
*        is_default_button = ABAP_FALSE

   
).

 
ENDIF.

 

 

 

 

Validation Logic:

 

 

Add the below code in the method WDDOBEFOREACTION of view
V_POPUP

 

 

  DATA lo_api_controller TYPE REF TO if_wd_view_controller.

 
DATA lo_action         TYPE REF TO if_wd_action.



  lo_api_controller
= wd_this->wd_get_api( ).

  lo_action
= lo_api_controller->get_current_action( ).



 
IF lo_action IS BOUND.

   
CASE lo_action->name.

     
WHEN 'OK'.

       
CALL METHOD cl_wd_dynamic_tool=>check_mandatory_attr_on_view

         
EXPORTING

            view_controller 
= lo_api_controller

           
.

   
ENDCASE.

 
ENDIF.

 

 

 

Create window W_POPUP as below

 

step10.png

 

 

Embed the view V_POPUP into window W_POPUP as below

step11.png

 

Active the WD component and create WD application as below

step12.png

 

 

Output:

 

 

 

Click on button “open pop up” and the pop up window is open as below

result1.png

 

 

 

Click on Ok button to see the validation errors as mandatory fields are not filled

 

result2.png