JavaScript returns undefined
I have the following JSON that I receive from a URL, we call the URL here www.blabla.com/testjson
And it returns:
[{"Identifier":1,"Naam":"NOT Given","Adres":"Kopenhagen 9","Postcode":"0000LL","Plaats":"NOT Given","Longitude":"0.00000","Latitude":"0.00000"},
{"Identifier":2,"Naam":"NOT Given","Adres":"NOT Given 1","Postcode":"0000LL","Plaats":"Rotterdam","Longitude":"0.00000","Latitude":"0.00000"},
{"Identifier":3,"Naam":"NOT Given","Adres":"NOT Given 6","Postcode":"0000LL","Plaats":"Rotterdam","Longitude":"0.00000","Latitude":"0.00000"},
{"Identifier":4,"Naam":"NOT Given","Adres":"NOT Given 1","Postcode":"0000LL","Plaats":"Den Haag","Longitude":"0.00000","Latitude":"0.00000"},
{"Identifier":5,"Naam":"NOT Given","Adres":"NOT Given 218","Postcode":"0000LL","Plaats":"Zoetermeer","Longitude":"0.00000","Latitude":"0.00000"}
];
I want to retrieve this JSON en return this result, but I get UNDEFINED, this is my code:
$.each("www.blabla.com/testjson", function(index, element) {
$('.result').append(element.Naam);
alert(element.Naam);
});
You also need to check if the user cookies are true or else it won't return something, I don't do this because I work with phonegap and jquery mobile. Can that be the problem?
Try using the method $.getJSON :
$.getJSON('http://www.blabla.com/testjson.json', function(data) {
$.each(data, function(key, val) {
$('.result').append(val.Naam);
alert(val.Naam);
});
});
For more information, check the online doc: http://api.jquery.com/jQuery.getJSON/
PS: Make sure that you added the website www.blabla.com to your whitelist exception.
For more information about Phonegap whitelist exceptions, check the online doc (the following link is for Phonegap / Cordova version 2.1.0): http://docs.phonegap.com/en/2.1.0/guide_whitelist_index.md.html#Domain%20Whitelist%20Guide
Your code will loop over each character of the param string "www.blabla.com/testjson", returning 'undefined' because by writing element.Naam you're trying to access a non existent property named 'Naam' of a character string.
You need to load the external json content by using an ajax call and parse it.
Here is a longer alternative to Littm's answer if you're interested in handling errors too:
$(document).ready(function()
{
$.ajax(
{
type: "GET",
url: "data.json",
data: "nocache=" + Math.random(),
// dataType: "json",
// the above requires 'application/json' as Content-Type headers
// see 'reference A' in the footer notes
// if you active this, please modify following code accordingly
success: function (source, textStatus, jqXHR)
{
var data = jQuery.parseJSON(source);
$.each(data, function(index, value)
{
alert(index+" "+value.Naam);
});
},
error: function(data)
{
// alert("ERROR");
}
});
});
Notes:
1. Reference A
EDIT: To get more info from error, add the following:
$(document).ajaxError(
function (event, jqXHR, ajaxSettings, thrownError)
{
console.log(event);
console.log(jqXHR);
console.log(ajaxSettings);
console.log(thrownError);
});
Then use the chrome console.
EDIT:
If I type the url you provided in a browser, I am redirected to a login page.
I think that your ajax code is getting this HTML document, too.
Try to check your session: you can add a div in your code and load the content of your url using curl inside this new div. Until you don't see your json code inside this div, your session variables are not working properly.
If curl will get correctly your file content, so will do ajax.
EDIT:
See? Your problem is to correctly login into the webservice from which you are trying to get the json file.
Your friend is right.
You have to set correctly your $_SESSION in PHP which basically use cookies to retain session info.
Try to correctly:
session_start() ;
at the beginning of your php code, before using ajax.
References:
- php.net session_start
- PHP session not working with JQuery Ajax?
Please note that this will work only within the same domain :
Why jquery ajax not sending session cookie
If you are using different subdomains you can try to use
setcookie
References: - php.net setcookie
- Cross domain cookie access (or session)
As far as I know there's no way to set cookies within different domains.
If you are in this situation, I suggest you to have a look at SimpleSAMLPHP descbribed here: cross domain cookies
Good luck :)