Skip to Content

In my last blog I used a custom GenIL component to create a Search and Result View. In this blog I will create an overview page and add navigations from the search result view to the details view.

 

Here are the steps to be followed:

Step 1: Create a Details View in the custom component created earlier

  • Give view name as EmployeeDetails
  • Create a Model Node ZEMPLOYEE using BOL Entity EMPLOYEE
  • Add model attributes
  • Bind the model node with custom controller context node
  • Select View Type as Form View

24.JPG

  • Arrange the fields in the configuration tab

25.JPG

 

Step 2: Create a Details Overview page

  • Right Click on Views and select Create Overview Page

26.JPG

  • Give a suitable name say DetailsOV
  • Assign the details view to the Overview page in the runtime repository

27.JPG

  • Move the EmployeeDetails view from available to displayed and save the configuration

28.JPG

  • Assign the views SearchVS and DetailsOV to the window and make SearchVS as the default view

29.JPG

Step 3: Create navigation from search page to details page

  • Redefine the method GET_P_EMPLOYEE_ID in the Result view

30.JPG

  • Add the following method to create a hyperlink

method get_p_employee_id.
case iv_property.
when if_bsp_wd_model_setter_getter=>fp_fieldtype.
rv_value = cl_bsp_dlc_view_descriptor=>field_type_event_link.
when if_bsp_wd_model_setter_getter=>fp_onclick.
rv_value =
‘DETAILS’.                                 “#EC NOTEXT
when if_bsp_wd_model_setter_getter=>fp_tooltip.
rv_value =
‘Click to see the details’.
endcase.
endmethod.

 

  • Create an event DETAILS in the Result view
  • Add the following code in the event handler

method eh_ondetails.
data: lr_employee
type ref to if_bol_bo_property_access,
lv_index      
type i.
cl_thtmlb_util=>get_event_info(
exporting
iv_event = htmlb_event_ex
importing
ev_index = lv_index ).
lr_employee ?= me->typed_context->zemployee->collection_wrapper->find( iv_index = lv_index ).
op_todetails( ).
endmethod.

 

  • Create an outbound plug ToDetails. Right click on Outbound Plugs in the View Structure of the result view and select ‘Create’
  • Add the following code

method op_todetails.
call method view_manager->if_bsp_wd_navigation~navigate

exporting

source_rep_view = rep_view

outbound_plug = ‘TODETAILS’.
endmethod.

 

  • Create a Navigational link in the runtime repository

31.JPG

32.JPG

 

The custom component is ready to be tested. When we click on Execute in the component workbench we get the following scereen. On clicking on Search or pressing Enter the result is displayed as shown below.

23.JPG

When we click on the hyperlink the details are shown

33.JPG

Note: As you can see the description is dependent on the record whose details are shown. This can be done with the following steps

  • Create a model node ZEMPLOYEE with BOL entity EMPLOYEE in the view DetailsOV and bind it with the custom controller

34.JPG

  • Go to the implementation class of the view DetailsOV and redefine the method IF_BSP_WD_HISTORY_STATE_DESCR~GET_STATE_DESCRIPTION
  • Add the following code

method if_bsp_wd_history_state_descr~get_state_description.

data lr_employee type ref to if_bol_bo_property_access.

data lv_employeename type zbol_emp_name.
lr_employee ?= me->typed_context->zemployee->collection_wrapper->get_current( ).

call method lr_employee->get_property_as_string
exporting
iv_attr_name      =
‘EMPLOYEE_NAME’*    iv_use_iso_format = ABAP_FALSE
receiving
rv_result         = lv_employeename
.concatenate ‘Details of’ lv_employeename into description separated by space.
endmethod.

To report this post you need to login first.

2 Comments

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

Leave a Reply