Hi, I provide training in SAP UI5. Also feel free to checkout my new web page https://saptechblog.com
Webdynpro ABAP

Drop down by Index

 

A DropDownByIndex UI element provides the user with a dropdown list box. You cannot select more than one entry from the selection list. The UI element consists of a text field, a button, and a selection list. Any list item already selected is displayed in the text field. When selecting the button, a list with all possible values is displayed.

When Binded with the table UI element, the drop down by index can have a different set of values for each row.

 

Let us do the similar example we did in the drop down by key.

 

 

Step 1 : Go to the Tcode SE80 and create a webdynpro component.

 

clip_image002

 

 

Assign the component to the package or save it in the local object.

 

 

Step 2 : In the context tab of the component controller create a node of cardinality 0..n.

 

clip_image004

 

 

Enter the node name and choose a cardinality. Press enter.

 

clip_image006

 

 

Add an attribute the context node text.

 

clip_image008

 

 

 

Create one more attribute in the root context node to be binded to the text view.

 

 

clip_image010

 

 

 

clip_image012

 

 

clip_image014

 

 

 

Step 3 : In the layout tab of the view controller do the following.

 

Insert a lable and drop down UI element . Set the property of the lable as.

 

clip_image016

 

 

Bind the binding text property of the UI element drop down to the text attribute of context node drop.

 

clip_image018

 

 

Create an event handler method for the drop down.

 

clip_image020

 

 

 

Insert a text view UI element and bind its text property to the text view attribute which we created.

 

clip_image022 

 

 

 

Step 4 : Initialize the values for the drop down.

 

clip_image024

 

 

Step 5 : In the event handler method, write the following codes.

 

clip_image026

clip_image028

 

 

Step 6 : Save and activate the whole component.

 

clip_image030

 

Step 7 : Create an application and test the component.

 

clip_image032

 

  

Output :

 

clip_image034

 

Choose a value from a drop down.

 

clip_image036

About Arun

0 Comments:

Post a Comment

Powered by Blogger.