Question Re: Create a JSON Model from data in file in Technology Q&A

Create a JSON Model from data in file

SandipAgarwalla — Tue, 03 Dec 2013 17:52:24 GMT

How do we create a JSON Model for the data which is defined in a .json file in the project resources

e.g. my data is stored in data.json file which is under models folder.

Now I need to create a model for it, I tried


var json = new sap.ui.model.json.JSONModel("/models/data.json");
json.setData({modelData:"sampleData"});


json.attachRequestCompleted(oData, function(){
  sap.ui.getCore().setModel("json",json);
     var nLength = json.getData().d.results.length;  
  alert(nLength);
  });

But it didn't work. The data.json has the format


var sampleData = [
{<somedata>},
{<somedata>}
];

Any pointers??

Thanks

Sandip

Re: Create a JSON Model from data in file

Former Member — Tue, 03 Dec 2013 22:38:34 GMT

Hi Sandip,

I just had a look in the SDK examples. This is one way to load JSON data from a file:


// Data is fetched here
  jQuery.ajax("Data.json", {   // load the data from a relative URL (the Data.json file in the same directory)
  dataType: "json",
  success: function(data){
  var oModel = new sap.ui.model.json.JSONModel(data);
  view.setModel(oModel);
  }
  });

In that case the JSON file format is like this:


{
  "countries" : [ {
  "name" : "Greece",
  "short" : "GR",
  "detailInfo": {
  "capital": "Athens",
  "population": 10787690,
  "area": 131990,
  "currency": "Euro",
  "flagUrl": "http://upload.wikimedia.org/wikipedia/commons/thumb/5/5c/Flag_of_Greece.svg/200px-Flag_of_Greece.svg.png"
  }
  },...

Hth,

Simon

Re: Create a JSON Model from data in file

former_member91307 — Wed, 04 Dec 2013 05:41:49 GMT

Hi Sandip,

JSON format could be validated with JSONLint - The JSON Validator.

Calling method setData is not required.

Below example might help

http://plnkr.co/edit/JMfSKGrA1xUimj9kzamO?p=preview

Thanks and Regards, Venkatesh

Re: Create a JSON Model from data in file

SandipAgarwalla — Wed, 04 Dec 2013 17:08:12 GMT

Hi Simon, Venkat

I tried both the approaches, but still get a problem - 4040 Not found

GET http://localhost:8080/<projectName>/models/data.json 404 (Not Found)

So the problem is somewhere else. I tried loading the resources but no help

sap.ui.localResources("<projectName>/models");

BTW, the json defined in the file had a minor issue. that is fxed - thanks venkat

Regards
Sandip

Re: Create a JSON Model from data in file

former_member91307 — Wed, 04 Dec 2013 17:41:41 GMT

Hi Sandip,

Please find attched snap shot of project structure.

Thanks and Regards, Venkatesh

Re: Create a JSON Model from data in file

SandipAgarwalla — Thu, 05 Dec 2013 17:22:01 GMT

HI Venkat

Still cant get it to work. I have the view defined in a separate folder.

so i tried

var json1 = new sap.ui.model.json.JSONModel("./models/data.json");

<note the period before /model> but error

GET http://localhost:8080/<projectName>/models/data.json 404 (Not Found)

Thanks

Sandip

Re: Create a JSON Model from data in file

former_member91307 — Thu, 05 Dec 2013 17:57:17 GMT

Hi Sandip,

Can you post a sanp shot of folder structure.

Could try the following too

1. sap.ui.localResources("<project_name>");

2. var json1 = new sap.ui.model.json.JSONModel("models/data.json");

Thanks and Regards, Venkatesh

Re: Create a JSON Model from data in file

SandipAgarwalla — Fri, 06 Dec 2013 04:18:34 GMT

Venkat

I already tried with jQuery.sap.require();

Here is the project structure

I even noticed the same problem if I add any image from the folder e.g. to a button icon

Thanks

Sandip

Re: Create a JSON Model from data in file

former_member182372 — Fri, 06 Dec 2013 04:54:24 GMT

Sandip, check the .war file to make sure it contains data.json file. BTW, do you have any servlets in web project?

Re: Create a JSON Model from data in file

SandipAgarwalla — Tue, 10 Dec 2013 16:19:03 GMT

Hi maksim

I do not have any servlets...the war file does contain the json file.

Well, the problem was the folders were under the webcontent->projectname, rather than under the webcontent folder

I fixed the folder structure..

Thanks

Sandip