Skip to Content
Author's profile photo Daniel Van Leeuwen

Getting Started with Kapsel – Appendix A — OData

/wp-content/uploads/2013/12/sap_logo_333927.png

Appendix A:  OData

Open Data Protocol (OData) is a data access protocol for web applications.  A JavaScript library such as datajs is used to access an OData source.

The below sample uses an OData source from OData.org.

There is a list of sample services available at http://www.odata.org/ecosystem.

One of the nice features of OData is how simple it is to access an OData source.  Simply enter the OData URL with a $metadata parameter to see a description of the service.  http://services.odata.org/OData/OData.svc/$metadata.

image1.PNG

This describes that there are four entities named Products, Advertisements, Categories, Suppliers, what fields are in each entity and the associations between them.

To access the data, specify which data to read such as http://services.odata.org/OData/OData.svc/CategoriesAs seen below, there are three categories, Food, Beverages and Electronics.

image2.PNG

The data is formatted as either atom(xml) or json.  The json format is less verbose.  http://services.odata.org/OData/OData.svc/Categories?$format=json

image5.PNG

The URLs to navigate the association between categories and products are shown in this link http://services.odata.org/OData/OData.svc/Categories(2)/Products?$format=json which shows the products for category 2 or Electronics.

image3.PNG

Here are a few more examples.

First three products http://services.odata.org/OData/OData.svc/Products?$top=3&$format=json

Fourth product http://services.odata.org/OData/OData.svc/Products(4)?$format=json

Products that start with the letter F http://services.odata.org/OData/OData.svc/Products?$filter=startswith(Name, ‘F’) eq true&$format=json

The following link may also be helpful. OData URI’s

The below steps demonstrate how to create a simple OData web app.

Create a folder named C:\ODataSample

Create a file named ODataSample\products.html and paste in the following code.

<html>
<head>

<script src="datajs-1.1.2.min.js"></script>
<script>
function successCallback(data, response) {   
var productsTable = document.getElementById("productsTable");
      for (var i = 0; i < data.results.length; i++) {
          var row = productsTable.insertRow(1);
          var cell1 = row.insertCell(0);
          var cell2 = row.insertCell(1);
          var cell3 = row.insertCell(2);
          cell1.innerHTML = data.results[i].Name;
          cell2.innerHTML = data.results[i].Description;
          cell3.innerHTML = data.results[i].Price;
      }
}
 
function errorCallback(e) {
      alert("An error occurred");
      alert(e);
}

function init() {
      OData.defaultHttpClient.enableJsonpCallback=true;
  //
http://datajs.codeplex.com/wikipage?title=OData%20Security&referringTitle=Cross%20Domain%20Requests
    OData.read("http://services.odata.org/OData/OData.svc/Products", successCallback, errorCallback);
}
</script>
</head>
<body onload="init()">
<table id="productsTable"><tr><th>Name</th><th>Description</th><th>Price</th></tr></table>
</body>
</html>

Download the latest datajs file (datajs-1.1.2.min.js) from datajs and place it in the folder ODataSample.

The datajs JavaScript library provides a read method that takes an OData URL and returns the data as a JavaScript object.

image4.PNG

See also the example Cross-Site Request Forgery (CSRF) in the security section that performs create, read, update and delete operations.

Back to Getting Started With Kapsel

Assigned Tags

      7 Comments
      You must be Logged on to comment or reply to a post.
      Author's profile photo Daniel Van Leeuwen
      Daniel Van Leeuwen
      Blog Post Author

      Updated for SMP 3.0 SP03

      Author's profile photo Manuel Ramirez
      Manuel Ramirez

      The example was not working for me, to make it work I just romved the line:

            OData.defaultHttpClient.enableJsonpCallback=true;


      and I changed

          OData.read("http://services.odata.org/OData/OData.svc/Products", successCallback, errorCallback);


      for

          OData.read("http://services.odata.org/OData/OData.svc/Products?$format=json", successCallback, errorCallback);



      Do you know why this happen?

      Author's profile photo Daniel Van Leeuwen
      Daniel Van Leeuwen
      Blog Post Author

      What browser are you using? 

      I use Chrome.

      What error did you get?

      Regards,

      Dan van Leeuwen

      Author's profile photo Manuel Ramirez
      Manuel Ramirez

      I'm using Chrome too.

      I'm not really getting and error but there is no result.

      Anyway, as I posted there, changing that lines, is working ok. It was just to know the difference, as both are posting JSON.

      Regards.

      Author's profile photo Former Member
      Former Member

      Hi,

      I am not able to download "datajs.1.1.3.js" library fro internet, when i have searched extensively then I am able to download "datajs.1.1.0.nupkg", but i don't know how to use nupkg file in html/javascript/jquery.

      Kindly guide me.

      ~Parth

      Author's profile photo Daniel Van Leeuwen
      Daniel Van Leeuwen
      Blog Post Author

      On the following website is an option to download the archive.

      https://archive.codeplex.com/?p=datajs

      In the downloaded zip there is a releases folder.
      In that folder is a releaseList.json folder that explains each file.

      Hope that helps,

      Dan van Leeuwen

      Author's profile photo Former Member
      Former Member

      Thank you, got it.