二维码

[教程] ADDING EDIT,CANCEL AND SAVE BUTTONS TO THE OVERVIEW PAGE TOOLBAR

Twilight发表于 2015-12-08 00:05Twilight 最后回复于 2015-12-08 00:05 [复制链接] 5479 0

Before reading this tutorial, create one context node at overview page level with base entity BTAdminh and bind it to the context node(which has base entity BTAdminh) of custom controller. (Refer custom controller and data binding and CREATING CONTEXT NODE )

Go to the overview page implementation class and redefine the method SET_VIEW_GROUP_CONTEXT. Write following code and activate it.
  1. METHOD set_view_group_context.

  2.   IF iv_first_time EQ abap_true AND me->view_group_context IS NOT BOUND.
  3.     IF iv_parent_context IS INITIAL.
  4.       CREATE OBJECT me->view_group_context TYPE cl_bsp_wd_view_group_context.
  5.     ELSE.
  6.       me->view_group_context = iv_parent_context.
  7.     ENDIF.
  8.   ENDIF.

  9. ENDMETHOD.
复制代码

Let us add three buttons to the overview page to provide EDIT, SAVE and CANCEL operations. In order to add buttons to overview page, we need to add the code to the method IF_BSP_WD_TOOLBAR_CALLBACK~GET_BUTTONS of over view page implementation class.
Go the overview page in UI component and redefine the method by choosing the option redefine after right clicking on it. After redefining it, double click on it to open the method.
buttons 1.jpg
Add the following code activate it.
  1. METHOD if_bsp_wd_toolbar_callback~get_buttons.

  2.   CALL METHOD super->if_bsp_wd_toolbar_callback~get_buttons
  3.     RECEIVING
  4.       rt_buttons = rt_buttons.

  5.   DATA: ls_button TYPE crmt_thtmlb_button_ext,
  6.         lr_header TYPE REF TO cl_crm_bol_entity.

  7.   lr_header ?= me->typed_context->header->collection_wrapper->get_current( ).

  8.   CLEAR ls_button.
  9.   ls_button-page_id       = me->component_id.
  10.   ls_button-type          = cl_thtmlb_util=>gc_icon_edit.
  11.   ls_button-on_click      = 'edit'.                         "#EC NOTEXT
  12.   IF lr_header IS BOUND AND view_group_context->is_any_view_editable( ) = abap_false
  13.      AND lr_header->is_change_allowed( ) = abap_true.
  14.     ls_button-enabled       = abap_true.
  15.   ELSE.
  16.     ls_button-enabled       = abap_false.
  17.   ENDIF.
  18.   APPEND ls_button TO rt_buttons.

  19.   CLEAR ls_button.
  20.   ls_button-page_id       = me->component_id.
  21.   ls_button-type          = cl_thtmlb_util=>gc_icon_cancel.
  22.   ls_button-on_click      = 'cancel'.                       "#EC NOTEXT
  23.   IF lr_header IS BOUND AND view_group_context->is_any_view_editable( ) = abap_false
  24.      AND lr_header->is_change_allowed( ) = abap_true.
  25.     ls_button-enabled       = abap_true.
  26.   ELSE.
  27.     ls_button-enabled       = abap_false.
  28.   ENDIF.
  29.   APPEND ls_button TO rt_buttons.

  30.   CLEAR ls_button.
  31.   ls_button-page_id       = me->component_id.
  32.   ls_button-type          = cl_thtmlb_util=>gc_icon_save.
  33.   ls_button-on_click      = 'save'.                         "#EC NOTEXT
  34.   IF lr_header IS BOUND AND view_group_context->is_any_view_editable( ) = abap_false
  35.      AND lr_header->is_change_allowed( ) = abap_true.
  36.     ls_button-enabled       = abap_true.
  37.   ELSE.
  38.     ls_button-enabled       = abap_false.
  39.   ENDIF.
  40.   APPEND ls_button TO rt_buttons.

  41. ENDMETHOD.
复制代码

When you are adding a new button to standard SAP overview page, do not forget to call the super class method.
ON_CLICK: we will assign event handler name to this property. So when this button is clicked, event handler will be triggered. (event handler name is case sensitive ).

TYPE : we can specify an icon over here. CL_THTMLB_UTIL has number of icons.

PAGE_ID :  it is page id in framework language. It could be look like this. C1_W1_V1 where C1 is your component controller and W1 is window and V1 is your current view.

Enabled : if this property is true, then button is enabled else disabled.

It is a standard scenario that once you click on EDIT button, page will be in editable mode. In this mode only we will enable save ,cancel buttons and Edit button will be disabled.
When user clicks either SAVE or CANCEL, then again EDIT button will be enabled. SAVE and CANCEL buttons will be disabled.

We are manipulating the ENABLED property of each button exactly in above mentioned way.
We will  discuss the scenario for EDIT button.

Its clear that , to edit or save or cancel, there should be data. So we are reading the data from current context node into lr_header.

First conditions is LR_HEADER is BOUND, which means if there is data, second is LR_header->IS_CHANGE_ALLOWED which means, if data can be changed (why we are testing this condition because the same data may be locked by different user at this point of time) and last condition is VIEW_GROUP_CONTEXT->IS_ANY_VIEW_EDITABLE = ABAP_FALSE which means, no view is already in EDIT mode, then enable the EDIT button else disable it.

You can try to understand the logic  for remaining buttons.

Activate and test the application.
buttons 2.jpg

We can notice all buttons are coming under group MORE. This is happened because we forgot to redefine one more method IF_BSP_WD_TOOLBAR_CALLBACK~GET_NUMBER_OF_VISIBLE_BUTTONS. This method controls the no of visible buttons on tool bar. Redefine it and give any integer value greater than 3.  If you give 4, then four buttons will be visible on tool bar and remaining buttons if exists any will be displayed as above.
  1. METHOD if_bsp_wd_toolbar_callback~get_number_of_visible_buttons.

  2.   CALL METHOD super->if_bsp_wd_toolbar_callback~get_number_of_visible_buttons
  3.     RECEIVING
  4.       rv_result = rv_result.

  5.   rv_result = 6.

  6. ENDMETHOD.
复制代码

Test the application. All your buttons should be visible.
buttons 3.jpg
回复

使用道具 举报

快速回帖

本版积分规则
您需要登录后才可以回帖 登录 | 注册有礼

快速回复 返回顶部 返回列表