Show TOC

Smart Variant Management Locate this document in the navigation structure

The sap.ui.comp.smartvariants.SmartVariantManagement control provides an interface to enable a simple integration of the VariantManagement control and access to the flexibility layer for easy communication.


The SmartVariantManagement control is a specialization of the VariantManagement control. This basic control handles the visual representation of the variants on the user interface.

The SmartVariantManagement control communicates with the sap.ui.fl flexibility layer. The layer of the SAPUI5 flexibility services provides a way to store and retrieve flexibility information, such as personalization data and variants for other controls.

Key users can modify and save a standard variant that is then stored in the layer of the SAPUI5 flexibility services.

Note It is strongly recommended to use the SmartVariantManagement control, because it enables the communication with the flexibility layer.

The SmartVariantManagement control is used in the following controls:

  • SmartFilterBar
  • SmartTable
  • SmartChart

In order to use the SmartVariantManagement control, consuming applications have to provide the following information and comply with the interface standard:

  • The control consuming the personalization (persControl)
  • A type
  • The name of the property describing the key
  • Optional information about the data source

This information has to be transferred to the SmartVariantManagement control during creation using the personalizableControl association. To transfer the data, the sap.ui.comp.smartvariantsPersonalizableInfo class must be used.

The persControl must also be attached to the Initialise event of the control and call the initialise method of the control, for example:"sap.ui.comp.smartvariants.SmartVariantManagement");"sap.ui.comp.smartvariants.PersonalizableInfo");
var oSmartVariantManagement = new sap.ui.comp.smartvariants.SmartVariantManagement();
var oPersInfo = new sap.ui.comp.smartvariants.PersonalizableInfo({
		type: "filterBar",
		keyName: "persistencyKey",
		dataSource: this.getEntityType()


   this._fInitialiseVariants = jQuery.proxy(this._initialiseVariants, this);


Once the SmartVariantManagement control has initialized the flexibility layer and retrieved the relevant changes, it informs the persControl about the ending of the initialization phase via the Initialise event.


To exchange data with the flexibility layer, the persControl has to provide the following public methods:

  • fetchVariant
  • applyVariant (oVariant)

The fetchVariant method is called by the SmartVariantManagement control every time this is triggered by interaction with the VariantManagement control and when executing a Save. In the latter case, the persControl has to return a JSON-compliant object. The flexibility layer treats this information as a black box. It does not manipulate this object in any way.

The applyVariant is called by the SmartVariantManagement control every time the user selects a new entry in the variant list. The previously stored JSON-compliant object will be transferred to the applyVariant method, and the persControl can now respond to the information stored in this object, for example:

sap.ui.comp.smartfilterbar.SmartFilterBar.prototype.fetchVariant = function() {
	var aFiltersInfo;
	var oVariant = {};
	aFiltersInfo = this._determineVariantFiltersInfo();

	oVariant.filterbar = (!aFiltersInfo) ? [] : aFiltersInfo;
	oVariant.filterBarVariant = this._fetchVariantFiltersData();

	return oVariant;

sap.ui.comp.smartfilterbar.SmartFilterBar.prototype.applyVariant = function(oVariant) {

Note The SmartVariantManagement control triggers the fetchVariant method without any user interaction right after it raises the Initialise event. This enables the SmartVariantManagement control to handle the standard variant. This variant represents the state of the user interface that is delivered by default. The control can revert the data to this variant every time the user selects the standard variant at a later point in time. The standard variant is not transferred to the flexibility layer and is therefore not stored.

Page Variant

A page variant is a single UI instance of the SmartVariantManagement control that can personalize not only one, but multiple smart controls.

To use this enhanced function of the SmartVariantManagement control, take the following into consideration:

  • The SmartVariantManagement control has a persistencyKey property of its own.

    This is the key for storing the personalization data of all smart controls that you want to make personalizable.

  • For each smart control, a persistency key has to be provided.

    Within the personalization data, this key will identify the specific data for each individual smart control.

  • The smart controls support the smartVariant association which has to be assigned along with the page variant reference.

Note If the page variant is hosted by the SmartFilterBar control, the persistency key of the page variant has to be assigned using the pageVariantPersistencyKey custom data of the SmartFilterBar control. The SmartFilterBar control internally adapts the related SmartChart or SmartTable controls, and, therefore, the smartVariant association doesn't have to be assigned.