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.
Great work Shubham, thanks!
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
Hi ,
Great Blog. Is it necessary to have two entitysets to implement this?
Hi,
Can we create multiinput value help with smart fields?
For this you can use sap.ui.comp.smartmultiinput
http://veui5infra.dhcp.wdf.sap.corp:8080/demokit/#/api/sap.ui.comp.smartmultiinput
ow did you add annotation in OData Metadata?
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?
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.
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
Awesome! Great work Shubham, thanks!
Best regards, Mike.
Does anyone know if the fields can be made "edit-only-via-valuehelp"?
That would be great to ensure valid input data.
can we display data without clicking the "GO" button...directly when click the filter
Did you find an answer?
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?
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?
Hello,
I have added same annotations directly as local annotations in WebIDE. But not in MPC_EXT class.
However field is not getting rendered as F4, no F4 icon is appearing at field level. Smart field is linked to Odata entity. Do we need to do something else in order to display F4 help at CDS level or MPC_EXT level.