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).