Fiori Elements: Hiding field Completely in View

light111Fiori Elements: Hiding field Completely in View


In the last post Fiori Elements- Use of value help , that tells about how to add a value hep to a search field. This post described  how to disable the appearance of a field in the view.

In the view, the field URL is only displayed on the detailed screen but not in the list screen.

1

Execute the app in the webIDE, in the list the URL field is hidden and go to the detailed view.

2

Here it appears. So it is controlled by the annotation assigned to the field URL. Go back.

3

If you select the view setting, here the URL field appears but not selected/listed. If you select here in the view settings, then it appears in the list.

4

The conclusion is, if the field appears in the consumption view, then if the list item position annotation is assigned to the field, then it appears in the list or else you can added them from the view settings.

5


But sometimes though the field is part of the consumption view, we can hide it completely on the view. Add the below highlighted annotation and then it is completely hidden in the view.

6

Now test the app. Now the field URL don’t appear on the list or detailed view nor in the list view settings.

7

8


The compete code:

910


@AbapCatalog.sqlViewName: ‘ZZSCARR_CP’
@AbapCatalog.compiler.compareFilter: true
@AbapCatalog.preserveKey: true
@AccessControl.authorizationCheck: #NOT_REQUIRED
@EndUserText.label: ‘Consumption Scarr Processing’
@OData.publish: true

@UI: { headerInfo:{ typeName: ‘Flight Basic’, typeNamePlural: ‘Flight Basics’} }
@Search.searchable: true
@VDM.viewType: #CONSUMPTION
define view ZZ_SCARR_CP
as select from ZZ_SCARR_TP
association [1..*] to ZZ_SPFLI_CP as _Spfli on $projection.carrid = _Spfli.carrid
{
@UI: {
facet: [
{ id: ‘ID1’, position: 10, type: #COLLECTION },
{ id: ‘ID2’, position: 20, type: #LINEITEM_REFERENCE, targetElement: ‘_Spfli’ },
{ parentId: ‘ID1’, type: #FIELDGROUP_REFERENCE, targetQualifier: ‘General’}
],
lineItem: [{ position: 10 }], identification: [{ position: 10 }] }
@Search.defaultSearchElement: true // carrid as the default search field
@Consumption.filter.hidden: true // hide this field in the consumption filter
key carrid,
—————————————————————————————
@UI: {
fieldGroup: [{ qualifier: ‘General’, position: 10 }], // search filter position
lineItem: [{ position: 20 }],identification: [{ position: 20 }] }
@EndUserText.label: ‘Carrier Name’
carrname,
—————————————————————————————
@UI: {
fieldGroup: [{ qualifier: ‘General’, position: 20 }],
lineItem: [{ position: 30 }], identification: [{ position: 30 }] }
@Consumption: { valueHelpDefinition: [{ entity:{ element: ‘currcode’, name: ‘ZZ_SCARR_VH’} }],
filter: { multipleSelections: true, selectionType: #SINGLE }
}
currcode,
—————————————————————————————
@Consumption.hidden: true // hides the field in the view (list/detailed/view settings)
@UI: { identification: [{ position: 40, importance: #LOW }] }
@Consumption.filter.hidden: true // hide this field in the consumption filter
url,
—————————————————————————————
/* Associations */
//ZZ_SCARR_TP
_Spfli
}


Additionally – we have to below annotations can be used to hide the field on the UI client. Depending on the what the purpose one of the annotation can be used.

11


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s