I get data from the server with Ajax.
Data returned (from firebug):
{"users":[{"name":"some name", "age":17},{"name":"some name2", "age":25}]}
When I try
$.post('server.php', function(data){
var users = eval(data).users;
alert(users[0].name);
});
I get on firebug:
Uncaught SyntaxError: Unexpected token )
Any help?
Please do not use eval - it's evil
Instead, simply use a parameter of "json".
$.post('server.php', function(data) {
alert(data.users[0].name);
}, "json");
If your headers are proper, you don't even need the json parameter, but it forces jQuery to want to receive and parse it as JSON.
encode data in brackets with single quotes
$.post('server.php', function(data){
var users = eval('('+data+')');
alert(users[0].name);
});
You have to surround the json string with brackets
$.post('server.php', function(data){
var users = eval('('+data+')').users;
alert(users[0].name);
});
DEMO
I don't get the point on eval() but maybe I don't know the function well...
With this works:
var data = {"users":[{"name":"some name", "age":17},{"name":"some name2", "age":25}]};
alert(data.users[0].name);
You also may loop with:
$.each(data.users, function (i, user_obj){
alert(user_obj.name);
});
Take a look at this demo.
It's better to add the dataType: "json" to your ajax request so it's properly parsed.
Related
I have a json from my server which is -
{"canApprove": true,"hasDisplayed": false}
I can parse the json like this -
var msg = JSON.parse('{"canApprove": true,"hasDisplayed": false}');
alert(msg.canApprove); //shows true.
At my ajax response function I caught the same json mentioned earlier by a method parameter jsonObject -
//response function
function(jsonObject){
//here jsonObject contains the same json - {"canApprove":true,"hasDisplayed": false}
//But without the surrounding single quote
//I have confirmed about this by seeing my server side log.
var msg = JSON.parse(jsonObject); // this gives the error
}
But now I got the following error -
SyntaxError: JSON.parse: unexpected character at line 1 column 2 of
the JSON data
Can anyone tell me why I am getting the error?
Your JsonObject seems is a Json Object. The reasons why you can't parse Json from a String:
the String is surround by " ". and use \" escape inside. Here is an example:
"{\"name\":\"alan\",\"age\":34}"
when you try to parse above string by JSON.parse(), still return the a string:{"name":"alan","age":34}, and \" is replace by ". But use the JSON.parse() function again, it will return the object you want. So in this case,you can do this:
JSON.parse(JSON.parse("{\"name\":\"alan\",\"age\":34}" ))
Your string use ' instead of " . example:
{'name':'alan','age':34}
if you try to parse above string by JSON.parse(), may cause error
I dont think you should call JSON.parse(jsonObject) if the server is sending valid JSON as it will be parsed automatically when it retrieves the response. I believe that if You set the Content-type: application/json header it will be parsed automatically.
Try using jsonObject as if it was already parsed, something like:
console.log(jsonObject.canApprove);
Without calling JSON.parse before.
This answer might help someone who's storing JSON as a string in SQL databse.
I was storing the value of following
JSON.stringify({hi:hello})
in MySQL. The JSON stored in SQL was {"hi":"hello"}
Problem was when I read this value from db and fed it to JSON.parse() it gave me error.
I tried wrapping it in quotes but didn't work.
Finally following worked
JSON.parse(JSON.stringify(jsonFromDb))
This worked and JSON was parsed correctly.
I know the storing mechanisim might not be appropriate however those were client needs.
Its already an object, no need to parse it. Simply try
alert(jsonObject.canApprove)
in your response function.
Json.parse is expecting a string.
Your jsonObject seems already parsed, you need to test if this is the case.
function(jsonObject){
var msg = (typeof jsonObject == "object" ? jsonObject : JSON.parse(jsonObject));
}
It's also possible that your call back is empty, it's generates the same error if you try to parse an empty string. So test the call back value.
function(jsonObject){
if(jsonObject) {
var msg = (typeof jsonObject == "object" ? jsonObject : JSON.parse(jsonObject));
}
}
var text = '{"canApprove": true,"hasDisplayed": false}';
var parsedJSON = JSON.parse(text);
alert(parsedJSON.canApprove);
This works. It is possible that you use " instead of ' while creating a String.
Here is an example of how to make an ajax call and parse the result:
var query = {
sUserIds: JSON.stringify(userIds),
};
$.ajax({
type: "POST",
url: your-url,
data: JSON.stringify(query),
contentType: "application/json; charset=utf-8",
dataType: "json",
async: true,
success: function (response) {
var your_object = JSON.parse(response.d);
},
failure: function (msg) {
alert(msg);
},
error: function (a, b, c) {
}
});
I faced similar problem and now it's solved. I'm using ASP.Net MVC to send value to .js file. The problem was that I was returning JsonResult from the Action method, because of this JSON.parse was failing in .js file. I changed the return type of Action method to string, now JSON.parse is working fine.
As someone mentioned up there, this actually fixes the problem. What I learnt from this is that may be how PHP encodes a json object is not familiar to JavaScript.
var receivedData = data.toString()
receivedData = JSON.parse(receivedData)
console.log(receivedData.canApprove)
This will work.
This is the result when I do console.log(data) within my AJAX callback
{"image":"http://placehold.it/290x120","url":"http://www.google.com.my"}
but when I do data['image'] or data['url'], it can't retrieve the value correctly. I also tried data[0]['image'] to no avail
So I guess data is returned from a ajax request. Your can use the following code to convert string to object:
data = JSON.parse(data);
If you are using jQuery to do the ajax request, you can add dataType: "json" to the ajax option. In this way, there's no need to convert data.
Your data in callback is JSON Object,then
var image=data.image;
var url=data.url;
have you tried data.image and data.url?
also try var x = eval(data);
then x.image and x.url
Be careful of eval() on untrusted data though!!
You need to parse it to Json
var retrieved = ......;
var json = JSON.parse(retrieved);
and then just use:
var image = json.image;
var url = json.url;
Usualy this code from jQuery API's page works great:
$.ajax({
dataType: "json",
url: url,
data: data,
success: success
});
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. It is also passed the text status of the response.
However, you must remember about the same origin policy as well as the about the correct server response's content type. For json response it should be application/x-javascript or at least text/json.
javascript does not have associative arrays, You should use a javascript object like
var data = JSON.parse(data)
and then you can acces it by
data.image and data.url
If You are getting string as a response then use like below.
var response = '{"image":"http://placehold.it/290x120","url":"http://www.google.com.my"}';
var data = eval("("+response +")");
console.log(data["image"]);
console.log(data["url"]);
I know this is usually an issue of unbalanced parens and curly braces, however after carefully sifting through my syntax, I have, to the best of my ability, confirmed the correct parity of each of these scope delimiters and have no other recourse except to allow my fellow S.O. pundits to take a gander at the following:
$.ajax({
url: "/application/get_programs_for_center",
type: "POST",
data: formdata,
success: function(response){
var options = $("#school_application_program_name");
var result = JSON.parse(response);
console.log(result);
$.each(result, function() {
options.append($("<option />").val(this.id).text(this.name));
});
}
});
N.B. the error is being thrown in the middle of the line var result = JSON.parse(response); specifically immediately after JSON.
The problem you have is that what you parse isn't JSON.
And the reason it's not JSON, is that the response argument you receive is already parsed from JSON by jQuery. Don't parse it again.
If you parse JSONArray, jQuery will not parse it into Object directly, you have to use JSON.parse(response)
However, if you parse a JSONObject, it will be identified and parse into Object automatically
So keep it in mind, that will help you!
I have a php returning some json in response to a POST request made via an ajax function.
In my php function I format the data like this:
//json return
$return["answers"] = json_encode($result);
echo json_encode($return);
This returns the following string:
answers: "[{"aa":"Purple","0":"Purple","ab":"Blue","1":"Blue","ac":"Red","2":"Red","ad":"Yellow","3":"Yellow"}]"
And this is where I am trying to catch it to use the data:
$.ajax({
type: "POST",
url: "http://ldsmatch.com/pieces/functions/question.functions.php",
dataType : 'JSON',
data: dataString,
success: function(data) {
alert(data.answers[0]["aa"]);
}
});
I've been trying to just alert the data so I can visualize it before setting up the vars I need, but am having some trouble formatting it correctly so it is usable.
If I alert data.answers[0] then it just shows me the first character in the string, which is a bracket [ and if i subsequently change the number it will go through each character in the returned string.
I have tried other variations, such as:
data.answers[0]["aa"] (this returns 'undefined' in the alert)
data.answers["aa"] (this returns 'undefined' in the alert)
data.answers[0] (this returns the first character of the string)
I feel like I'm close, but missing something. Any guidance appreciated.
edit:
thanks for all the suggestions. I removed the second json_encode and was able to parse with data.answers[0].aa
success: function(data) {
var json = $.parseJSON(data);
alert(json.answers[0]["aa"]);
}
Use parseJson like this
var json = $.parseJSON(data);
$(json).each(function(i,val){
$.each(val,function(k,v){
console.log(k+" : "+ v);
});
});
What if you remove double-encoding on PHP side? You've got an object with JSON string instead of object with first property being object itself, or you may explicitly decode "answers" property on client side as it was suggested above.
I am receiving following data from server
"[{\"role_id\":\"1\",\"name\":\"administrator\",\"created_by_user_id\":\"2\",\"time_created_on\":null,\"is_user_based\":\"0\"},{\"role_id\":\"2\",\"name\":\"manager\",\"created_by_user_id\":null,\"time_created_on\":null,\"is_user_based\":\"0\"}]"
which is simply an array of two objects . Even after setting 'dataType' to json I am not receiving native javascript array inside my success callback function but if I use
$.ajaxSetup({
url:'/public/admin/role/list',
dataType:'json'
});
$.ajax({
success:function(data) {
alert(data[0].name); // alert box pop up as 'undefined '
var data = $.parseJSON(data);
alert(data[0].name) ; //works
}
});
Don't escape the ". They're required for JSON parsing.
[{"role_id":"1","name":"administrator","created_by_user_id":"2","time_created_on":null,"is_user_based":"0"},{"role_id":"2","name":"manager","created_by_user_id":null,"time_created_on":null,"is_user_based":"0"}]
You have a trailing comma when setting dataType in your ajaxSetup method:
dataType:'json',
^
Also I hope those \ in the JSON you have shown here are not part of the actual response from the server. The response should look like this:
[{"role_id":"1","name":"administrator","created_by_user_id":"2","time_created_on":null,"is_user_based":"0"},{"role_id":"2","name":"manager","created_by_user_id":null,"time_created_on":null,"is_user_based":"0"}]