Skip to Content
Author's profile photo Shubham Kumar

Smart Field with Value Help using Annotations

In this blog, I am going to discuss how I have implemented smart field with Value help for Commodity code using Annotations.

Working of Smart Field

There are two way to enter value in commodity code smart field .

  • Value Help Suggestion
  • Value Help F4

 

Value help Suggestion

On directly entering value in the smart field, it starts suggesting the various commodity codes with description to select from the list.

From the suggestions list we can select the desired Commodity Code which would get populated in the smart field.

Value Help F4

On pressing F4 we will get a Popup of value help with empty list

After pressing Go button with or without giving search criteria it will load the commodity codes in to the list.

From this list we can select required commodity code. The selected commodity code would get populated in the commodity code smart field.

Implementation of smart field

It requires two entity one base entity and other for commodity code.

  • POLineItem
  • CategoryF4

 

POLineItem entity  have a property called CategoryId with sap:label as Commodity Code for which smart field needs to be given.

CategoryF4 entity have two properties.

  • CategoryId with sap:label as Commodity Code
  • CategoryText with sap:label as Commodity Code Description

For smart field to be editable base entityset i.e. PoLineItemSet must be updatable true.

CategoryId field is bound in view.xml with the smart Field control.

In OData Metadata, we use following annotation to tell the Framework that the UI element which is bound to “CategoryId” field in the model should render as value list.

In the above snip

‘1’ denotes  the target path for which Value list to be given i.e. for CategoryId in POLineItem entity. Here we are using <Annotation Term=”com.sap.vocabularies.common.v1.ValueList”> for value help.

‘2’ denotes the CollectionPath , here the entityset to be given from where the list of categories are coming i.e. CategoryF4Set.

‘3’ denotes the search bar which is available in popup.

‘4’ denotes the Record, here it is ValueListParameterOut which will act as key which would get populated in the smart field after selecting from the list.

‘5’ denotes the LocalDataProperty , the field name of POLineitem for which value list is given.

‘6’ denotes the ValueListProperty, the key field of CategoryF4.

‘7’ denotes the Record, here it is ValueListParameterDisplayOnly, So it would be visible in the suggestion list and value help popup alongwith CategoryId for display purpose only.

 

Assigned tags

      15 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Marcio Martins
      Marcio Martins

      Great work Shubham, thanks!

      Author's profile photo Sukhram Bhamboo
      Sukhram Bhamboo

      Hi Subham,

      I want to make suggestion list as multiselect and want to add button "OK" with parallel to "Cancel" button. So after clicking on F4 help, this value help box will be opened and once user has filtered data. Filtered data will be shown in suggestion list as multiselect not single select. User can select multiple suggestion items and then press "OK" button and selected items will be reflected in smart field.

      Is it possible without custom, I mean using standard smart field and annotation. Is there any field or property or attribute of smart field or odata annotation through which i can get this functionality.

      Regards

      Sukhram Bhamboo

      Author's profile photo Akshaya Parthasarathy
      Akshaya Parthasarathy

      Hi ,

       

      Great Blog. Is it necessary to have two entitysets to implement this?

      Author's profile photo Akshaya Parthasarathy
      Akshaya Parthasarathy

      Hi,

      Can we create multiinput value help with smart fields?

      Author's profile photo Jayendra Kartheek Garnimetta
      Jayendra Kartheek Garnimetta

      For this you can use sap.ui.comp.smartmultiinput
      http://veui5infra.dhcp.wdf.sap.corp:8080/demokit/#/api/sap.ui.comp.smartmultiinput

      Author's profile photo ricardo alcantara
      ricardo alcantara

      ow did you add annotation in OData Metadata?

      Author's profile photo Julian Paulina
      Julian Paulina

      Hi thank you very helpful.

      I was wonder can you add this to a local annotation file in the code editor ?

      I can't find  <Annotation Term=”com.sap.vocabularies.common.v1.ValueList”> for value help.

      Or is this only for Odata v4?

      Author's profile photo Michael Dräyer
      Michael Dräyer

      Hi Julian,

      ensure that you have the right target selected in the annotation modeler.

      You can only use ValueList-annotation for Entity Type Properties and not for the whole Entity Type.

       

       

      Author's profile photo Faina Fridman
      Faina Fridman

      Hi. Thank you for the blog.

      I wanted to ask, how the binding is done. Can you post the code of controller.js where the binding is done.

      Whether such annotations can be done via SAP Gateway?

      Thanks in advance.

      Best regards. Faina

      Author's profile photo Michael Dräyer
      Michael Dräyer

      Awesome! Great work Shubham, thanks!

      Best regards, Mike.

      Author's profile photo Christophe Swolfs
      Christophe Swolfs

      Does anyone know if the fields can be made "edit-only-via-valuehelp"?
      That would be great to ensure valid input data.

       

      Author's profile photo Jai Sharma
      Jai Sharma

      can we display data without clicking the "GO" button...directly when click the filter

      Author's profile photo Burak Özçetin
      Burak Özçetin

      Did you find an answer?

      Author's profile photo Phani Vasabattula
      Phani Vasabattula

      Thank you for the blog. I have a question as well. Would it possible to display the description instead of key after a value is being selected in the Value Help? I could have it in dropdown, but the list is limited to 100 entries. Would it be possible to remove that check?

      Author's profile photo Stefan Siemes
      Stefan Siemes

      We are having the same issue.

      The value help should return the Id as selected key, but not as value property alone. It would be nice if the displayed value could be controllable for a single input field like in a multiinput-token or dropdown list. for a non-smart input field with a list binding it is working... (see API samples ...)

      Think about common numerical sap internal ids, they are not self-explanatory as currency codes. We actually don’t want to display them at all!

      Tried to use TextArrangement Annotations, edited the TextFormat (but “Value” is default anyway)., set selected key and value after change manually (then the control complaint about contrainsts ...) So nothing helped. But maybe anybody has a workaround?