Show TOC

Container Mode: Simple Use CaseLocate this document in the navigation structure

This example shows how to use the container mode.

In this example we create the same user interface as in Direct Mode: Simple Use Case.

Implementation Steps

We need the following steps in our application:

  • Application initialization:

    • Get the container and read the personalization data.

  • React to the Save button:

    • Write the personalization data to the container and save the container.

Get the Container and Read the Personalization Data

The factory method getContainer is asynchronous as it loads the personalization data from the storage. In the respective done method the data from the respective item is read.

Sample Code
var that = this;
...
oComponent = sap.ui.core.Component.getOwnerComponentFor(this.getView());
oPersonalizationService = sap.ushell.Container.getService("Personalization");
...
oScope = {
  keyCategory : oPersonalizationService.constants.keyCategory.FIXED_KEY,
  writeFrequency: oPersonalizationService.constants.writeFrequency.HIGH,
  clientStorageAllowed : false,
  validity : 30
};
oPersonalizationService.getContainer("sap.ushell.samples.persSample1", oScope, oComponent)
  .fail(function() {
    jQuery.sap.log.error(“Loading personalization data failed.”)
  })
  .done(function(oContainer) {
    that.oContainer = oContainer;
      that.oFruits = oContainer.getItemValue("fruits");
      that.oVegetables = oContainer.getItemValue("vegetables");
      // Pseudocode: apply the personalization data to the UI checkboxes
  };
Write the Personalization Data to the Container and Save the Container
Sample Code
var that = this;
...
this.oContainer.setItemValue("fruits", this.oFruits);
this.oContainer.setItemValue("vegetables", this.oVegetables);
this.oContainer.save()
  .fail(function() {
    jQuery.sap.log.error(“Saving personalization data failed.”)
  })
  .done(function() {
    // Tell the user that the data is saved
  };