Creating Simple WebDynpro ABAP using Contextual panel
Follow the below step to create an simple WebDynpro Application using Contextual Panel UI
Step 1: Goto T-code : SE80
Step 2: Create New WebDynpro Component “ZCONTEXT_PANEL“
Step 3: After creating component activate the entire Component and controllers. In view, insert Contextual panel UI element
Step 4: Insert view switch element inside contextual panel element
Step 5: Insert free contextual panel to insert other UI element
Step 6: Insert text view in free contextual area
Step 7: Create another contextual panel
Step 8: Insert free contextual area in second contextual panel
Step 9: Insert transparent container inside free contextual area
Step 10: Insert two transparent containers inside main transparent container
Step 11: Insert text view in both transparent containers
Step 12: Create Two Nodes as below
Node1 ‘REP’
Attribute ‘REP’ type String
Node2 ‘VISIBILITY’
Attribute ‘FIRST’ type Boolean
Attribute ‘SECOND’ type Boolean
Step 13: Bind REP node in Item source properties of view switch element and Bind REP attribute in item text properties of view switch element
Step 14: Create method ‘SHOW’for view switch element
Step 15: Bind the attribute first from visibility node to the visibile properties of tc_first element and Bind the attribute Second from visibility node to the visibile properties of tc_second element
Step 16: Use below Code in WDDOINIT
METHOD wddoinit .
DATA : lo_nd_reports TYPE REF TO if_wd_context_node.
DATA : lo_nd_visibility TYPE REF TO if_wd_context_node.
DATA : ls_reports TYPE wd_this->element_rep.
DATA : lt_reports TYPE wd_this->elements_rep.
* Default Graph Show
lo_nd_visibility = wd_context->get_child_node( name = wd_this->wdctx_visibility ).
lo_nd_visibility->set_attribute( name = ‘FIRST’ value = abap_true ).
lo_nd_visibility->set_attribute( name = ‘SECOND’ value = abap_false ).
lo_nd_reports = wd_context->get_child_node( name = wd_this->wdctx_rep ).
* Setting the Drop Down & Other Values
ls_reports-rep = ‘FIRST’.
APPEND ls_reports TO lt_reports.
ls_reports-rep = ‘SECOND’.
APPEND ls_reports TO lt_reports.
lo_nd_reports->bind_table( lt_reports ).
ENDMETHOD.
Step 17: Use below code in Method SHOW
METHOD onactionshow .
DATA lo_nd_reports TYPE REF TO if_wd_context_node.
DATA lo_nd_visibility TYPE REF TO if_wd_context_node.
DATA ls_visibility TYPE wd_this->element_visibility.
lo_nd_reports = wd_context->get_child_node( name = wd_this->wdctx_rep ).
lo_nd_reports->set_lead_selection_index( index = index ).
lo_nd_visibility = wd_context->get_child_node( name = ‘VISIBILITY’ ).
IF index = 1.
ls_visibility-first = abap_true.
ls_visibility-second = abap_false.
ELSEIF index = 2.
ls_visibility-first = abap_false.
ls_visibility-second = abap_true.
ENDIF.
lo_nd_visibility->set_static_attributes( EXPORTING static_attributes = ls_visibility ).
ENDMETHOD.
Output
Second panel result will be display based on action taken in first contextual panel
