In the previous tutorial Change Color of the Label and Input field in UI for Form View – Part 1 I have shown how to change the color property of the fields or labels.

In this tutorial I am going to show how to change the properties of an input field and labels.

Step 1: I have created a BSP Application with a value node which has four attributes./wp-content/uploads/2013/09/color1_274220.jpg


Step 2: Create a Z Class in SE24, say ZL_THTMLB_FORM_ITERATOR_SAMPLE. Add an interface IF_CHTMLB_FORM_ITERATOR.


Step 3: Implement the method RENDER_CELL_START of interface IF_CHTMLB_FORM_ITERATOR.

METHOD if_chtmlb_form_iterator~render_cell_start.
DATA: lr_bee        TYPE REF TO cl_bsp_bee_table,
lr_label     
TYPE REF TO cl_thtmlb_label,      ” Label Properties
lr_inputfield
TYPE REF TO cl_thtmlb_inputfield, ” Input field Properties
lv_html      
TYPE        string.

CREATE OBJECT lr_bee.

CASE iv_binding_string.
WHEN ‘//COUNTRY/COUNTRYNAME’.         ” Check the current processing field is for countryname
IF iv_element_name = ‘label’.
lr_label ?= iv_element_bee
.
lr_label
->design = ‘HEADER1’.     ” Style of label (font property)
lr_label
->textdirection = ‘LTR’” Label Direction (Left)
lr_label
->required = abap_true.   ” Creates required mark on label
ENDIF.

WHEN ‘//COUNTRY/COUNTRYCODE’.         ” Check the current processing field is for countrycode
IF iv_element_name = ‘inputfield’.
lr_inputfield ?= iv_element_bee
.
lr_inputfield
->password = abap_true” Makes field as password field
lr_inputfield
->tooltip = ‘Enter Password’. ” Tool tip for the field
ENDIF.
ENDCASE.

lr_bee->add_bee( bee = iv_element_bee level = 2 ).
ev_replacement_bee
= lr_bee.
ENDMETHOD.

Note: //COUNTRY/COUNTRYNAME – Here COUNTRY is the value node and COUNTRYNAME is the attribute of that node.

Step 4: Change the HTM file of form view to set the iterator.

color.JPG

Snapshot:

color.JPG

The label “Name” is bold, left aligned, and size is increased with mandatory indication.

To report this post you need to login first.

Be the first to leave a comment

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

Leave a Reply