Someone please tell me what is wrong with my $.parseJSON [javascript / jquery] - javascript

Here is my tested result. I run my app, I get the "Hello" alert. But I don't get "After parse JSON" alert.
When I comment out the var rstList = $.parseJSON(data); line, "After parse JSON" alert prompted correctly.
I have check many document and reference but couldn't find out what is wrong with my $.parseJSON(). Please advice, thank you.
//Show restaurant listing
$('#restaurantList').on("pagebeforecreate", function() {
$.getJSON("http://mydomain/api/restaurant", function( data ) {
alert('Hello');
var rstList = $.parseJSON(data);
alert('After parse JSON');
});
});

Contrary to what the name implies, $.getJSON doesn't give you some JSON but the result of the parsing.
From the documentation :
The success callback is passed the returned data, which is typically a
JavaScript object or array as defined by the JSON structure and parsed
using the $.parseJSON() method.
You data is already parsed, don't parse it.
BTW, as Niet commented, you should have looked at the console to have a little more information on the error halting your script's execution. See Using the console.

Because you are trying to parse a json object again. Which causes the error. $.getJSON
will return the json object. You dont need to parse it again

Related

How To Use JSON Returned From a URL in Javascript?

I have a URL which returns JSON data. I would then like to use some parts of this data in Javascript. At the moment I'm getting an 'Uncaught Syntax Error' in the console when I run it.
My code looks like this:
var myAPIcall = "https://maps.googleapis.com/maps/api/geocode/json?address=SW1A1AA&callback=?";
$.get(myAPIcall, function( data ) {
console.log("Place ID = " + data.results.place_id);
}, "json" );
It's the JSON itself which is causing the error.
How can I get the JSON (specifically the place_id, but I'd be happy with any of it) to display with the console.log? If I understand that much I should then be able to move on and use the place_id in my code.
Thanks
Check our query. Removing callback=? will result in a valid JSON :-)
var myAPIcall = "https://maps.googleapis.com/maps/api/geocode/json?address=SW1A1AA";
$.getJSON(myAPIcall, function( data ) {
console.log(data.results[0].place_id);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

save parsed JSON as obj

first question ever, I'm trying to parse a JSON file stored within the same file directory on my webhost as my html file that runs the javascript to parse it, I've added a console.log to debug and confrim that the file is being caught by the 'get' to ensure that I am able to 'get' the file throgh the use of jquery getJSON, in the callback i've tried to create a function that re-defines a global variable as an object containing the parsed data, but when I try to inject it into a document.getElemendtById('example').innerhtml = tgmindex.ToughGuys[1].name;
it returns a error "Uncaught TypeError: Cannot read property '1' of undefined"
here's my js/jquery
var tgmIndex;
$(document).ready(function () {
$.getJSON("http://webspace.ocad.ca/~wk12ml/test.json",function(data){
console.log( "success" );
tgmIndex =$.parseJSON;
document.getElementById('tgm1').innerHTML= tgmIndex.ToughGuys[1].name;
});
});
and here is whats contained in the JSON (i made sure to try linting it first and it's a valid json)
{"ToughGuys":[
{"name":"Ivan", "position":"Executive"},
{"name":"Little Johnny", "position":"Intern"},
{"name":"Beige Cathy", "position":"Executive"},
{"name":"Stan", "position":" original Intern"}
]}
You're setting tgmIndex to the parseJson function.
Should be doing tgmIndex =$.parseJSON(data);
Presumably your service is returning application/json. Therefore data already contains the json.
tgmIndex = data;
Then... "Tough Guys" is what you should be indexing. Not "ToughGuys"
Your example JSON is wrong in your question. If I go to
http://webspace.ocad.ca/~wk12ml/test.json
I see:
{"Tough Guys":[
{"name":"Ivan", "position":"Executive"},
{"name":"Little Johnny", "position":"Intern"},
{"name":"Beige Cathy", "position":"Executive"},
{"name":"Stan", "position":"Intern 0"}
]}
See "Tough Guys" There's your problem.
document.getElementById('tgm1').innerHTML= tgmIndex['Tough Guys'][1].name;
If data for some reason isn't JSON:
tgmIndex = $.parseJSON(data);

JSON Reader issue: cannot access jsonData

I have a strange thing going on here: I am using a JSON reader within a store to fetch search results. After loading the store I receive data or error states (built together as a JSON, too). So in both ways I get a successfully response, so I have to check the JSON for myself to trap "error conditions". But I cannot access the jsonData property that shhould be a JSON object within the reader. Chrome tells me that:
I can access the applyDefaults though (it returns true in that case) but not the jsonData.
My code looks like this:
var result = searchStore.getProxy().getReader();
console.log(result.jsonData);
The output is "undefined". As you can see in the picture the jsonData object holds my JSON (with the isError property I wanted to access).
What I am doing wrong?
You need to think more async and think of the timing it takes for a request to return and when you are trying to get the jsonData. Instead of using console.log, set a breakpoint or use the debugger; statement so you can freeze the browser and walk through the code. You can then inspect variables and such to see what the object looks like.
Try to access your JSON data in a success callback, to make sure the data is gathered from the server.

Json can not be parsed when received dynamically (using socket.io)

I am receiving json-datas which is 100% correct formatted json data.
My problem is,
when I run the following code it works:
var data = {"datas":[{"matts":{"active":"1","status":"off"},"config":null,"adapters":[]}}]};
console.dir(data); // it works.
but when I receive the same data on socket.io like following code, its not working:
_liveSock.on('sm', function(data)
{
console.log(data); // I am receiving the data correctly.
console.dir(data); // But I cant display the data.
});
Both codes are almost the same logic, only the second one is received dynamically.
When I try to use console.dir(data); on second code, it gives this error:
there is no kind object
(btw. I am using Firefox/Firebug)
Is there another method or way to use dynamically received json datas?
Thank you!
You can't use console.dir() until you have parsed the value.
console.dir(JSON.parse(data));
The JSON facility is not available in older browsers. You can find parsers online.

Accessing JSON values with a variable

I'm trying to access JSON data with jQuery and grab a specific set of values based on a variable. I've done this before using [] but for some reason I can't figure out what is going wrong this time.
My JSON file (being read in by getJSON, and named jsonmaker.php) looks like this:
{"0107001":{"label":"Canada","x":"0","y":"0.34"},"0107002":{"label":"USA","x":"-0.16","y":"0.53"}}
I then have a function which is essentially this:
function addAttrib(attrib) {
$.getJSON("jsonmaker.php", function(data) {
alert(data[attrib].label);
}
}
But it keeps returning undefined. Any idea what I'm doing wrong? I've checked to make sure the var going to attrib is 0107001, no problems there.
Also, I know my JSON file is a php file so I could filter what's returned to match the attrib value, but I'm looking to develop something that can run purely on HTML and JS, so I could just pack the JSON file for the project and take it with me. No need for a web server w/ PHP etc.
The data access itself works for me:
var data = {"0107001":{"label":"Canada","x":"0","y":"0.34"},"0107002":{"label":"USA","x":"-0.16","y":"0.53"}};
var attrib = "0107002";
alert(data[attrib].label); // USA
Make sure that attrib remains untouched between the moment you call addAttrib() and the moment when the AJAX request completes and your anonymous callback function gets called.
Update: is this your real code? You have at least one syntax error:
function addAttrib(attrib) {
$.getJSON("jsonmaker.php", function(data) {
alert(data[attrib].label);
}); // <- Please note missing ");"
}
In my experience, $.getJSON() doesn't always return an object. Depending on the MIME type that the server returns along with the JSON, you might end up with a string instead of an object. Check what data contains. If it's a string, you must manually parse it using eval() (old style) or JSON.parse() (new browsers only).
try to list all properties from data, to have sure the data is being returned:
for (var p in data){
if (data.hasOwnProperty(p){
alert(data[p]);
}
}
It's not your solution but with this you can know how your data is coming.

Categories

Resources