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 flexibility layer provides a way to store and retrieve flexibility information, such as personalization data and variants for other controls.

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

Prerequisites for Use

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.

In order 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.