The RadioButtonGroupByKey UI element groups the individual radio button UI elements in table form, and only one radio button can be selected within the UI element group.
Unlike radio button the radio Button group by Key has only the selected key property. The Radio button group by key gets the list of values from the attributed binded to the selected key property. The attribute must be of some data element with fixed range values. Radio button group by key displays the option for the fixed range values. Say for example if i bind the attribute of type BSYTP then the radio button displays all the fixed values assigned to it domain.
Domain fixed values for the data element BSTYP.
Scenario : Let us create a radio button group by key UI element, and bind it to the fixed range values of the BSTYP. Then read and display the values in the radio button.
Step 1 : Go to the Tcode SE11 and create a webdynpro component as shown below.
Assign the component to the package or save it in the local object.
Step 2 : In the context tab of the view controller create a context node as shown below.
Enter the node name and press enter.
Context node will be created as shown below.
Create an attribute for the context node of type BSTYP.
Enter the attribute name and type and press Enter.
Step 3 : In the layout tab of the view controller, Insert a radio button Group by key UI element as shown below.
Provide the ID and type for the UI element.
Bind the obligatory binding selected key of the radio button to the attribute key.
The list of radio button will contains all the fixed values in the domain.
Step 4 : Insert a Button UI element and create a event handler method for that Button.
Set the property Text of the button ui element and create an event handler method for it as shown below.
Step 5 :
Create a context attribute text of type string to be binded to the text view UI element.
Insert a text view UI element and bind the text property of the text view UI element to the attribute text which we created.
Step 6 :
In the event handler method for the read value button, write the code to read the radio button selected and set the text attribute accordingly.
To know which radio button is selected the read the attribute which is binded to the selected key property of the radio button. The system will provide the value of which
radio button is selected in that attribute.
Using code wizard read the key attribute which is binded to the radio button and press enter.
System will genreate the code as below.
Note : I have removed the unwanted and dead codes.
The attribute lv_key will now contain the value of the radio button selected.
Set the context attribute text according to the radio button selected.
Code will be generated as below.
Modify the code as below to set the text according to the radio button selected.
Step 7 : Activate the whole component.
Step 8 : Create an application and test the component.
Output :
Select a radio button and click on read value.
I am getting only a single digit value as output. why is it so?
ReplyDeleteGreat document and its so clean....
ReplyDeleteStep 1 : Go to the Tcode SE80
ReplyDelete