Adding fragment to part of XML view in SAPUI5

To add a fragment to part of the page in XML view first you need to create the XML Fragment i.e Display.fragment.xml
Then in the parent XML view add the VBox where you want to add the fragment after clicking a button

Create the function that will call the fragment after clicking the button

//To show the fragment
_showFormFragment: function(sFragmentName) {
var oFormFragment = sap.ui.xmlfragment(this.getView().getId(), "omsslist.view." + sFragmentName, this);
var vBox = this.byId('displayFragment');

Then inside the button click action add the code



Using mock data in SAPUI5

To use the data in a mock file that is saved locally in the “model” folder you need to loadData from that file as follows:


onInit: function() {
// set data model on view
//var data = {
//"studentSet": [{
//"name": "Kareem",
//"class": "KG1",
//"Nationality": "Palestinian"
//}, {
//"name": "Ahmad",
//"class": "KG3",
//"Nationality": "Saudi"
//var oModel = new JSONModel();

var oModel = new JSONModel();
// Load JSON in from the file



Continue reading

Creating and Deploying SAP Fiori Extension Project

To create the extension project in SapWebIDE choose new extension project and follow the simple steps where you decide the system and the application you want to extend

After you do the changes you want, you need to deploy this project to SAP System, to do that select your project and choose Deploy to ABAP Repository, then choose the system where you want to deploy your app with the package and transport request.

Note: if you cannot change the $TMP package then you need to apply the following sap notes: 2047506, 2046730.

After that you have to create the LPD_CUST and Semantic Object entries to create a tile on FLP for this extension.

Continue reading

Get all metadata fields for odata service

In order to get all the metadata fields for oData metadata using javascript use the getServiceMetadata()

var oModel = this.getView().getModel();
var metadata = oModel.getServiceMetadata();

//Get the fields
var entityRef = metadata.dataServices.schema[0].entityType[0];
var listOfProperties =;

for (var i = 0; i < listOfProperties.length; i++) {
	var a = listOfProperties[i].name;
	console.log(a); // a is the field name

entityType[0] => change 0 to the index of the service path that you want

Apply a theme to fiori logon page

Go to SICF,
In Service Path put: /sap/bc/ui5_ui5/ui2/ushell/…(F8)….
Double click in service ushell and edit,

– Logon Data (tab)
Procedure = Standard
Clear User field
-Error Pages (tab)
set option “System Logon” and go to configuration button
set Custom Implementation option
in ABAP Class put “/UI2/CL_SRA_LOGIN”

Custom logoff page
Login to Fiori ECC system having proper authorization.
Execute transaction SCIF and go to node /sap/public/bc/icf/logoff
Once the service loads, navigate to Error Pages->Logoff Page->Redirect to URL. Click on the pencil icon on the top left screen and enter the redirection URL as/sap/bc/ui5_ui5/ui2/ushell/shells/abap/Fiorilaunchpad.html
Click on Save button to save your entries.
After clicking on Save button, the wizard will prompt for credentials. The password entry needs to be made here to complete this implementation.

Learn SAPUI5

End users prefer to have any data available at any time and at any place. As a result, there are requirements for a broad range of devices and technologies to be able to meet this demand.

To download SAPUI5 gor to and download openui5

Continue reading