SAPUI5 Application Consuming OData service with SAP WEB IDE
Pre–requisites
1.HCP(Hana Cloud Platform)Account with SAP WEB IDE enabled.
Steps
- Configure OData destination.I am using northwind OData service.From HCP cockpit choose destinations->New Destinations
2.Start SAPWebIDE from Services of HCP cockpit
3.From SAP Web IDE menu select File->New->Project from Template
4.Select ‘SAPUI5 Application template’.From Available versions we have two options SAPUI5 Innovation and SAPUI5 1.28.Select SAPUI5 1.28
5.Give a meaningful project name.I am giving OdataConsumingApp.Leave namespace empty.Click Next.select view type XML and name view1(we are not changing it).Click Next.Click Finish.A new project will be created in workspace.
6.Right Click Application->New->OData Service.
7.Select Service URL from sources.Then Select Odata service from dropdown menu.If you dont see your service in drop down check step 1.Type in service URL and click play button.If no error occur we can see service details in right side of the service selection.Click Next. Click Finish.Now the selected OData service is connected to our App.
8.Its time to do some coding.Open component.js in code editor by double clicking.Paste below code in init method after the call to the base component.This is for accessing the service url from the config and creating an OData model and setting it to application.
9.Now we will add some code for view.Open View1.view.xml.Paste below code inside Page’s content aggregation.We are using a list and binding it to Categeries enitityset of northwind OData service.
10.See our application in action.Right Click on Application->Run->Run As->Web Application.
Good one Rajeesh.
I just tried creating a sample application following the above mentioned steps.But after selecting the Service Url from the sources I'm not able to find the service in the dropdown even after typing the Url there. How should I find it?
Hi Ramya ,
did you configure destination as mentioned in first step?
see SAPUI5 Application Consuming OData service with SAP WEB IDE PART-1 - SAP ABAP,SAPUI5,SAP HANA,SAP Fiori,OData,Netweaver …
for more details
Hi Rajeesh,
Yes,I had configured the destination.But I forgot to select the SAPUI5 1.28 version during template selection.Now I'm able to get the list.
Thanks Rajeesh.
If you are using latest version of sapui5.You can set the model in manifest.json under models section by following code
after adding the service to the app
"models": {
"" : {
"dataSource": "<servicename>"
}
If you are a beginner to sapui5 visit
Developing Web Apps with SAPUI5 -
Hello Ramya
I am newbie to SAP UI5. What is the importance of selecting the 1.28 version only here?
As you have said, even my destination got displayed under the service drop down after I selected the version 1.28.
You may be interested in reading this: SAP Web IDE local development with SAP HANA On Premise
Hi Rajesh,
Step 1-
WebIDEenables. TRUE
New Destination I have a added a 3rd party web services. Connection TEST Response returned 200 "OK".
Step.2... followed your steps
Step.3....followed your steps
Step 4.. I have couple of new options.
1.50, 1.52, .144, & 1.38
I check will all the combinations, I am not able to see my destination I created.
Note: the 3rd party web services that I have integrated is not a oData.
Where is the missing link.!!