This article explains how to use an custom extension web item to combine a standard query with simple HTML and demonstrate the advantages to have access to the BW backend.

Scenario

We want to insert a Title bar which corresponds to the corporate identity of our company. The standard text item can’t support the formatting, but HTML can.

By a click on the button the font family can be influenced. In addition the user should be able to see his authorization roles.

Next to this extensions the standard analysis grid must be displayed

Settings in the Web Template

Create a web template with a button group item, custom extension web item and a analysis item (with a suitable Dataprovider). The web template should be similar to this:

Settings of the custom extension web item

Button Group Item

The Button Group item should change the value of the property “FONT” in the custom extension web item.  In my example I used the font family “ARIAL” and “FUTURA”.

ABAP Class

Now the interesting stuff comes…

Based on the custom extension web item a abap class in the BW Backend is adressed. The ABAP class will receive the properties and the query data as an XML.

The ABAP Class will then do whatever it dos and return the results as an XML String back to the SAP WAD which then will be converted to HTML.

Web Template setting

Definition what data provider information will be transferred:

Access variables container

You use this parameter to determine whether to pass variable values to the ABAP class. You get the variable values using the I_XML parameter of the ABAP EXECUTE method.

Access navigational state

Select this parameter if you want to pass the navigational state (for example, filter values, drilldown state, axes information) to the ABAP class.

Access result set

Select this parameter if you want to pass the data cells (numbers) to the ABAP class.

Source:  SAP Help

In my example the setting above can be used since we don’t need the data provider data.

Creation of the ABAP Class

…by copying CL_BICS_CONS_WEBITEM_SAMPLE to ZWAD_CUSTOM_EXTENSION

The *SAMPLE Abap Class is a delivered ABAP Class for the Custom Extension Web Item. All necessary methods interfaces etc. are already defined in this class.

ABAP Interface IF_BICS_CONS_WEBITEM_CUST_EXIT

The interface provides the framework for the ABAP Class like the ABAP methods needed etc.

Source: SAP Help

The attribute P_PROPERTIES can be used to store your HTML. It is a global attribute and can be used in all methods:

Method: INITIALIZE

The method Initialize is called in the first step of the ABAP Class and can be used to read out the name/value pairs which are defined in the custom extension web item.

The parameter I_T_PROPERTIES is an internal table which contain all name/value pairs.

In my example I use this method to generate my HTML since only in this method the properties of the web item can be accessed. The following coding is used:

DATA: l_s_name_value TYPE rsbolap_s_name_value,

        user           TYPE XUBNAME,

        lw_agr_users   TYPE AGR_USERS,

        i              TYPE n,

        lt_agr_users   TYPE STANDARD TABLE OF AGR_USERS.

* assemble a heading

* ======================================================================

  CLEAR p_properties.

* Select User Roles

* ======================================================================

SELECT * FROM AGR_USERS INTO TABLE lt_agr_users

  WHERE UNAME EQ sy-uname.

* assemble name/value lines

* ======================================================================

LOOP AT i_t_properties INTO l_s_name_value.

* Create “Title”

* ======================================================================

CONCATENATE p_properties ‘<p style=”font-family:’ l_s_name_value-value ‘,Times,serif”><font family=”Century Gothic” color=red> This text is written in: ‘ l_s_name_value-value  ‘</font></p>’ INTO p_properties.”#EC NOTEXT

* Create HTML table with User Roles

* ======================================================================

CONCATENATE p_properties ‘<h3>Your Authorization roles</h3>’ INTO p_properties.

CONCATENATE p_properties ‘<table cellspacing=”0″ border=”1″ bordercolorlight=”#ffffff”>’ INTO p_properties.

CONCATENATE p_properties ‘<tr>’ INTO p_properties.

CONCATENATE p_properties ‘<td style=”font-family:Arial,sans-serif; font-size:13px;  padding:2px”>’ INTO p_properties.

CONCATENATE p_properties ‘No’ INTO p_properties.

CONCATENATE p_properties ‘</td>’ INTO p_properties.

CONCATENATE p_properties ‘<td style=”font-family:Arial,sans-serif; font-size:13px;  padding:2px”>’ INTO p_properties.

CONCATENATE p_properties ‘Role’ INTO p_properties.

CONCATENATE p_properties ‘</td>’ INTO p_properties.

CONCATENATE p_properties ‘<td style=”font-family:Arial,sans-serif; font-size:13px;  padding:2px”>’ INTO p_properties.

CONCATENATE p_properties ‘from’ INTO p_properties.

CONCATENATE p_properties ‘</td>’ INTO p_properties.

CONCATENATE p_properties ‘<td style=”font-family:Arial,sans-serif; font-size:13px;  padding:2px”>’ INTO p_properties.

CONCATENATE p_properties ‘to’ INTO p_properties.

CONCATENATE p_properties ‘</td>’ INTO p_properties.

CONCATENATE p_properties ‘</tr>’ INTO p_properties.

i = 1.

LOOP AT lt_agr_users INTO lw_agr_users.

CONCATENATE p_properties ‘<tr>’ INTO p_properties.

CONCATENATE p_properties ‘<td style=”font-family:Arial,sans-serif; font-size:11px; padding:2px”>’ INTO p_properties.

CONCATENATE p_properties i INTO p_properties.

CONCATENATE p_properties ‘</td>’ INTO p_properties.

CONCATENATE p_properties ‘<td style=”font-family:Arial,sans-serif; font-size:11px; padding:2px”>’ INTO p_properties.

CONCATENATE p_properties lw_agr_users-AGR_NAME INTO p_properties.

CONCATENATE p_properties ‘</td>’ INTO p_properties.

CONCATENATE p_properties ‘<td style=”font-family:Arial,sans-serif; font-size:11px; padding:2px”>’ INTO p_properties.

CONCATENATE p_properties lw_agr_users-FROM_DAT INTO p_properties.

CONCATENATE p_properties ‘</td>’ INTO p_properties.

CONCATENATE p_properties ‘<td style=”font-family:Arial,sans-serif; font-size:11px; padding:2px”>’ INTO p_properties.

CONCATENATE p_properties lw_agr_users-TO_DAT INTO p_properties.

CONCATENATE p_properties ‘</td>’ INTO p_properties.

CONCATENATE p_properties ‘</tr>’ INTO p_properties.

i = i + 1.

ENDLOOP.

CONCATENATE p_properties ‘</table>’ INTO p_properties.

ENDLOOP.

Method: FREE

This ABAP method is called in the following cases:

●      Closing the application

●      Logging off from the system

●      Changing the Web template

It can be used to develop ABAP which is executed for these special events.

Method: EXECUTE

The method is used to transfers the ABAP Class results back to the Custom Extension Web Item.

Depending on the settings in the web item, the parameter i_xml contains the navigational state and/or the result set.

So in this method you can basically access all data from the query and it’s navigation state, work with it in ABAP and give it back to the web template to generate your own HTML (incl. BI WAD web items).

The result is stored in an XML structure (E_XML)

In my example the HTML in P_PROPERTIES must be converted back to E_XML so that the Web Template can handle it. To achieve this I used the following coding:

  DATA:

    l_xml    TYPE  string,

    l_string TYPE  string.

  CLEAR e_xml.

  TRY.

*     The following section assemble a small HTML snippet to be returned

*     to the UI

*     ==================================================================

*     name/value pairs

      l_string = p_properties.

*     heading

*     The customer exit returns HTML data to be displayed.

*     The result HTML needs to be stored in E_XML using UTF-8 encoding.

*     You can convert simple ABAP-strings to UTF-8 by calling the

*     following the method:

*     ==================================================================

      CALL METHOD cl_bics_cons_webitem_util=>string_2_utf8_xstring

        EXPORTING

          i_string       = l_string

        RECEIVING

          r_utf8_xstring = e_xml.

    CATCH cx_bics_cons_webitem_error.

*     exception handling

  ENDTRY.

Debugging

Since the web template and the abap class is executed in the web, we can’t use the standard abap debugger. To control your coding in case of an error you can use the FM “RRMS_MESSAGE_HANDLING” with the following parameters:

I_CLASS = BRAIN

I_TYPE = S

I_NUMBER 143

Source: SAP Help

also published on http://sap-user-blog.com