SAPUI5 CRUD Master-Detail Application with MII OData Modeller and Web IDE

SAPUI5 CRUD Master-Detail Application: This is a step by step guide to create a simple SAPUI5 CRUD Master Detail Application using SAP Web IDE  and SAP MII OData Modeller.

Prerequisites:

• SAP MII 15.1 SP03 (OData Modeller is a new feature available from MII 15.1 SP03 )
• SAP HANA Cloud Connector
• Trial Account in SAP HANA Cloud Platfrom

Step 1 : Create OData (2.0) Service using MII OData Modeller

OData Modeller helps in exposing Manufacturing Data Objects (MDO) as OData 2.0 compliant services.

Create Sample MDO

Let’s create following sample MDO in MII, which can be exposed as OData Services.

Persistent MDO : Material

Create Entity in OData Modeller

• Open OData Modeller from MII Menu under Content Development.
• Click on Create Button.
• Provide Entity Name Field as Material.
• Select MDO Material(Created in the Step above).
• OData Modeller will show all the available attributes under Properties.
• Click on Save Button.

Enter the below mentioned URL in Browser to test MII OData Service

https://miiserver:port/XMII/MIIODataV2/Material

Step 2 : Configure SAP MII as Destination in HANA Cloud Platform 

Install and Configure HANA Cloud Connector

Install SAP HANA Cloud Connector by following

https://help.hana.ondemand.com/hcp > SAP HANA Cloud Connector > Installing the Cloud Connector

and Configure the same by following

https://help.hana.ondemand.com/hcp > SAP HANA Cloud Connector > Configuring the Cloud Connector

Once HANA Cloud Connector is installed and Configured, Follow the below steps to Map SAP MII to HANA Cloud Platform

• Login to HANA Cloud Connector and Navigate to Access Control.
• Click on Add Button under Mapping Virtual to Internal System.
• Select SAP Application Server Java.

• Click Next Button.
• Select relevant protocol and Click on Next Button.
• Enter MII Hostname and Port Number.

• Press Next Button until Finish and Click on Finish.
• Select the Line Item added and Click on Add Button under Resources Accessible.

• Enter URL Path as “/” and click on Save Button.
• Now the State will change to Green in both the Tables as shown below.

Create Destination in HANA Cloud Platform 

Follow the below steps to create Destination in HANA Cloud Platform

• Login to your HANA Cloud Platform Cockpit.
• Navigate to Connectivity > Destination.
• Click on New Destination and provide details as in the below screen shot.

• Provide URL as your MII System URL (https://:/).
• Provide MII User and Password.
• Click on Save.

Step 3 : Create CRUD Master-Detail Application using Web IDE

Follow the below steps to create simple CRUD Master-Detail Application in Web IDE

• Open Web IDE, select Workspace > Right Click > New > Project from Template.
• Change Category as All Categories.
• Select CRUD Master Detail Application.

• Click Next
• Provide below mentioned details and click on Next

• Select Service URL and Select System as MIINEW (Created in Step 2)
• Enter Relative URL as “/XMII/MIIODataV2/” and click on Test. Entity Material will be visible under MIIODataV2 as shown below

 

• Select Material and Click on Next.
• Select details as mentioned below and click on Next

• Click Finish, A new Project with Name Material will be created in Workspace.
• Select Project and Select App in FLP Sandbox near Run Button.
• Click on Run to test the Project.

• Click + Button to Add Material.
• On click of Save data will be saved to MII MDO.

The Steps above will help in creating a simple SAPUI5 CRUD Master-Detail Application in Hana Cloud Platform using MII OData Modeller.