Creating Extended Value Selector (EVS) - Static and Dynamic in Web Dynpro for Java

By Satya Sreelata Nemmaluri, YASH Technologies

Description: 

 Extended value selector (EVS) is a type of value-help where a dictionary simple type is bound to an input filed.
 During the runtime a table pops up which allows its entries to be sorted and filtered.
 Extended value selector is used when the values exceed 30.
 The following example explains about the steps to be followed in order to use the extended value selector in web dynpro java.

Step 1. Creating a web dynpro project. 

Navigation:

 Open NWDS
 Open web Dynpro explorer.
 File->New->Web Dynpro project
 Give the name of the project as ‘Extended_Value_Selector’

Step 2. Creating a simple type ‘Object’. 

Navigation:

Web dynpro explorer->Extended_Value_Selector->Dictionaries->local dictionary->data types->simple types. 

  

 Confirm by choosing finish.

 Let the data type be string.
 Choose the tab Enumeration.
  

 Add value and text for the new element.

 Confirm by choosing finish.
 Populate the enumeration with some elements.
  

Save the changes by clicking on save all metadata on the application tool bar. 

Step 3. Creating a web dynpro component. 

 Create a webdynpro component in the same package as that of the simple type.
 
  

 Confirm by choosing finish.

Step 4. Creating context elements 

 Edit the context of the view EVS_ComponentView.

 Create a value attribute ‘Object’ in the context of the view EVS_ComponentView 
  Confirm by choosing finish.
 Select the context attribute and switch to the properties tab of it.
 Assign the dictionary simple type Object as type the attribute.

Press ok to continue.
Save the changes by clicking on save all metadata on the application tool bar. 

Step 5. Applying template for the view 

 Choose the tab layout of the view EVS_ComponentView.

 Create two groups one for the static approach and the other for the dynamic approach.
 Apply template to the view.
 Choose form.

 Check the attribute Object.

  

 Choose next.
 Change the Editor property of the attribute to input field.
  

 Confirm by choosing finish.

 Create a new value attribute ‘Object _Dynamic ‘of type string for Dynamic approach in the context of the view EVS_ComponentView

 Confirm by choosing finish.

 Apply template to group dynamic by selecting the context attribute Object_Dynamic.
Save the changes by clicking on save all metadata on the application tool bar. 

 Choose next.
 Change the Editor property of the attribute to input field.
  Confirm by choosing finish.

Step 6. Code for populating the values dynamically 

 Select the implementation tab of the EVS_ComponentView.

 Write the following code under the method wdDoInit();

Step 7. Creating an application for the web dynpro project 

Navigation.

 Web dynpro explorer->Extended_Value_Selector->web dynpro->Application.

 Right click on application and create a new application.
  

Step 8. Rebuild the project

Navigation.

Web dynpro explorer->Extended_Value_Selector

 Right click on Extended_Value_Selector.

 Choose rebuild project.

Step 9. Deploy and run the application 

Navigation 

Web dynpro explorer->Extended_Value_Selector->web dynpro->application->EVSApplication. 

 Right click on EVS Application and choose Deploy new archive and run.
 You can see the output in the browser as shown below.

 A table pops up with the key and display texts once you click on the icon beside the input field.

 We can Filter the values according to the starting letter.

We can also sort the key and texts using selected column as key.