Technology Blogs by Members
Explore a vibrant mix of technical expertise, industry insights, and tech buzz in member blogs covering SAP products, technology, and events. Get in the mix!
Showing results for 
Search instead for 
Did you mean: 
Active Contributor

When enhancing a SAP CRM view a few days ago I noticed a simple way to generate standardizes buttons in the Web UI. I'm quite sure that most people know this approach already. Nevertheless, I totally missed it up until know and therefore it would be worthwhile blogging about it.

When creating a button I'd usually use one of the following approaches (depending if I need to create the button in a BSP or in ABAP code).

<thtmlb:button id      = "SaveandBack"
               onClick = "SaveandBack"
               enabled = "<%= abap_true %>"
               iconSrc = "<%= cl_thtmlb_util=>get_icon_url( 'saveandback.gif' ) %>"
               tooltip = "<%= otr(CRM_IC_COMP_UI_BUAG/SAVEANDBACK) %>" />

DATA: button TYPE crmt_thtmlb_button

button-id       = 'SaveandBack'. "#EC NOTEXT
button-on_click = 'SaveAndBack'. "#EC NOTEXT
button-text     = cl_wd_utilities=>get_otr_text_by_alias( 'CRM_IC_COMP_UI_BUAG/SAVEANDBACK' ).
button-tooltip  = cl_wd_utilities=>get_otr_text_by_alias( 'CRM_IC_COMP_UI_BUAG/SAVEANDBACK' ).
button-icon_src = cl_thtmlb_util=>get_icon_url( 'saveandback.gif' ).

This approach forces me to do three things which each an every button I create:

  • Search for an appropriate icon
  • Search for or create a suitable icon text
  • Search for or create a suitable tool tip text.

As a consequence, all buttons created this way might differ a little bit (e.g. the save icon is used for a button that executes a "save and back" action). This is also true for a large number of SAP standard views in SAP CRM.

The solution to this is hidden in the constants of the class CL_THTMLB_UTIL and the type attribute of thtmlb:button. In order to, for example, create a "save and back" button one only needs to look up the correct constant in CL_THTMLB_UTIL. Then this constant can be use to create a button using the code shown below:

<thtmlb:button id   = "SaveandBack"
               type = "<%= cl_thtmlb_util=>gc_icon_saveandback %>"
               enabled = "<%= abap_true %>" />

DATA: button TYPE crmt_thtmlb_button

button-id       = 'SaveandBack'. "#EC NOTEXT
button-type     = cl_thtmlb_util=>gc_icon_saveandback.

Using the constants defined in the class CL_THTMLB_UTIL it is possibe to create buttons including a icon, a text and a tool tip without the need to search for OTR tests and icons. Furthermore, if the same constants are used for buttons representing the same action, this leads to a nice standardizes UI.

If you are interested which icons and texts are created using on of the constants in CL_THTMLB_UTIL you can have a look at CL_THTMLB_UTIL=>GET_ICON_INFO. This method is called in the implementation class of the <thtmlb:button> element (i.e. CL_THTMLB_BUTTON).

Labels in this area