CODEWITHSUNDEEP
javascriptjsonajax
Anusha
Anusha

Reputation: 249

Javascript JSON Parsing using https url

I am trying to fetch the json data using a url.Now i need to parse the Json data to fetch only feeds data from the url.I am adding the code below and the json data.Can anyone help me how can i parse feeds data from the following json output.thankyou.

JSON DATA:

{
  "channel": {
    "id": 9,
    "name": "my_house",
    "description": "Netduino Plus connected to sensors around the house",
    "latitude": "40.44",
    "longitude": "-79.996",
    "field1": "Light",
    "field2": "Outside Temperature",
    "created_at": "2010-12-13T20:20:06-05:00",
    "updated_at": "2014-02-26T12:43:04-05:00",
    "last_entry_id": 6060625
  },
  "feeds": [{
    "created_at": "2014-02-26T12:42:49-05:00",
    "entry_id": 6060624,
    "field1": "188",
    "field2": "25.902335456475583"
  }, {
    "created_at": "2014-02-26T12:43:04-05:00",
    "entry_id": 6060625,
    "field1": "164",
    "field2": "25.222929936305732"
  }]
}

$.ajax({
  url: " https://api.thingspeak.com/channels/9/feeds.json?results=2",
  dataType: "json",
  cache: false,
  error: function(xhr, ajaxOptions, thrownError) {
    debugger;
    alert(xhr.statusText);
    alert(thrownError);
  },
  success: function(json1) {
    console.log(json1);
    if (json1.length == 0) {
      window.alert("The returned output array length is ZERO.");
    } else {
      var obj1, Feed;
      for (var x = 0; x < json1.length; x++) {
        obj1 = json1[x];
        console.log(obj1);
        if (obj1 == null || obj1 == "") {
          window.alert("\n The " + (x + 1) + "th object is NULL/BLANK.");
        } else {

          if (obj1.feeds == null || obj1.feeds.length == 0) {
            window.alert("\n The name portion of " + (x + 1) + "th object is NULL/BLANK.");
          } else {
            Feed = obj1.feeds;

            for (var k = 0; k < Feed.length; k++) {
              console.log("\n The deails of " + (x + 1) + "th Object are :  \nCreated_at: " + Feed[k].created_at + "\nEntry_id:" + Feed[k].entry_id + "\nField1:" + Feed[k].field1 + "\nField2:" + Feed[k].field2);
            }
          }
        }
      }
    }
  }
});

Upvotes: 0

Views: 246

Answers (4)

Anusha
Anusha

Reputation: 249

the answer for the above issue is as follows.

 $.ajax({
    url: " https://api.thingspeak.com/channels/9/feeds.json?results=2",
   dataType: "json",
   cache: false,
   error: function(xhr, ajaxOptions, thrownError) {
   debugger;
   alert(xhr.statusText);
   alert(thrownError);
   },
   success: function(json1) {
   console.log(json1);
   json1.feeds.forEach(function(feed, i) {
  console.log("\n The deails of " + i + "th Object are :  \nCreated_at: " + feed.created_at + "\nEntry_id:" + feed.entry_id + "\nField1:" + feed.field1 + "\nField2:" + feed.field2);
});

Upvotes: 0

Useless Code
Useless Code

Reputation: 12422

json1 isn't an array, it's an object. You need to access the .feeds property of the object to get to the array of feeds. Something like this:

$.ajax({
  url: " https://api.thingspeak.com/channels/9/feeds.json?results=2",
  dataType: "json",
  cache: false,
  error: function(xhr, ajaxOptions, thrownError) {
    debugger;
    alert(xhr.statusText);
    alert(thrownError);
  },
  success: function(json) {
    console.log(json);
    if (!json || json.feeds === undefined || json.feeds.length === 0) {
      window.alert("The returned output array length is ZERO.");
    } else {
      json.feeds.forEach(function (feed, index) {
        var indexPlusOne = index + 1;
        console.log("The deails of " + indexPlusOne + "th Object are :  \nCreated_at: " + feed.created_at + "\nEntry_id:" + feed.entry_id + "\nField1:" + feed.field1 + "\nField2:" + feed.field2);
      });
    }
  }
});

You could make it a little more readable if you use ES2015 and template strings:

$.ajax({
  url: " https://api.thingspeak.com/channels/9/feeds.json?results=2",
  dataType: "json",
  cache: false,
  error: (xhr, ajaxOptions, thrownError) => {
    debugger;
    alert(xhr.statusText);
    alert(thrownError);
  },
  success: (json) => {
    console.log(json);
    if (!json || json.feeds === undefined || json.feeds.length === 0) {
      window.alert("The returned output array length is ZERO.");
    } else {
      json.feeds.forEach(function (feed, index) {
        var indexPlusOne = index + 1;
        console.log(`
The deails of ${indexPlusOne}th Object are:
Created_at: ${feed.created_at}
Entry_id: ${feed.entry_id}
Field1: ${feed.field1}
Field2: ${feed.field2}`);
      });
    }
  }
});

Unless you really need to use the cache option I would also simplify it to just use jQuery.getJSON instead of jQuery.ajax:

$.getJSON("https://api.thingspeak.com/channels/9/feeds.json?results=2")
  .fail((req, status, err) => {
    console.error(`AJAX call failed: ${err}`);
  })
  .done((data) => {
    console.log(data);
    if (!data || data.feeds === undefined || data.feeds.length === 0) {
      window.alert("The returned output array length is ZERO.");
    } else {
      data.feeds.forEach(function (feed, index) {
        var indexPlusOne = index + 1;
        console.log(`
The deails of ${indexPlusOne}th Object are:
Created_at: ${feed.created_at}
Entry_id: ${feed.entry_id}
Field1: ${feed.field1}
Field2: ${feed.field2}`);
      });
    }
  });

Upvotes: 2

cn0047
cn0047

Reputation: 17091

The problem here is that you try to work with string and try to get length (json1.length), but jquery under the hood return for you JSON object (because you've specified dataType: "json").
So you have to work not with string but with object! And in your example you have simple object with property feeds, hence you need just traverse array which is in json1.feeds.

Here my example (I've just updated success callback):

json1.feeds.forEach(function(feed, i) {
  // This is your code, I've just copy-paster it here.
  console.log("\n The deails of " + i + "th Object are :  \nCreated_at: " + feed.created_at + "\nEntry_id:" + feed.entry_id + "\nField1:" + feed.field1 + "\nField2:" + feed.field2);
});

Upvotes: 0

inQstvJS
inQstvJS

Reputation: 303

Simply parse the feeds array for individual feed : 

json1.feeds.forEach(function(feed){
  console.log("th Object are :  \nCreated_at: " + feed.created_at
  + "\nEntry_id:" + feed.entry_id + "\nField1:" + feed.field1 + "\nField2:" + feed.field2);      
});

https://plnkr.co/edit/WSgdO6dZsyIAQVxWkTzr?p=preview

Upvotes: 1

Related Questions