JSON with PHP and JQUERY - almost there!

MeltingDog · 06-05-2012, 01:28 PM

Hi all,

I am pretty much learning JSON from scratch and am having some problems finding good resources. I was wondering if anyone here could just help me push this over the line.

Basically my situation is:

I have a server with a CMS. I want information from the CMS to appear on several other sites.

On a PHP Snippet on the 1st server I have:

Code:

header("content-type: application/json");
header("Access-Control-Allow-Origin", "*")
header("Access-Control-Request-Method", "GET")
header("content-type", "application/x-javascript")

$item1 = 'hello';


$item1 = json_encode($users);
echo $_GET['jasoncallback'] . '(' . $item1 . ')';

On the 2nd .html page I have:

Code:

 $.ajax({ url:"http://localhost/mbff_cms?jsoncallback=?", 
                     dataType: "jsonp", 
                     data: {jsoncallback:'jsoncallback'},
                     success: function(msg) {
                     console.log('server answered:', msg);
                     // do something with received message
                     }
                     });

The result I get in the console is:

GET http://localhost/mbff_cms/?jsoncallb...=1338898608228 jquery-1.7.2.js:8123

Obviously I just want to see the word 'Hello' in the console. I just want to pass the PHP variable over to the .html page and display it using jquery.

Can anyone help me get this over the line?

Thanks heaps!

DaveyErwin · 06-05-2012, 07:29 PM

i think you are not close .
You are fetching from the server,
with your jqueery ajax, some text
that has been formatted as jsonp,
if you don't fully understand what
i just said then, you are really
not close at all.

Ajax usually only works
in the same domain while
jsonp can be called from
a different domain .

No good reason i can
think of for mixing the
two as you have ?

MeltingDog · 06-06-2012, 02:11 AM

Thanks Davey,

Would I be better replacing the Ajax with something like:

$.getJSON("http://localhost/mbff_cms?jsoncallback=?",
function(data) {
console.log(data)
});

DaveyErwin · 06-06-2012, 02:57 AM

this works on the same server ...

Code:

<!doctype html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
<title></title>
</head>
<body>
<script> 
req = new XMLHttpRequest;
req.open("GET","json.php",false);
req.send(null);
alert(JSON.parse(req.responseText).a);// alerts "I'm a!"

</script> 
</body>
</html>

no need to wrap the json
with a function call ...

json.php ...

PHP Code:


			
<?php

class Foo

{

    public $a = "I'm a!";

    public $b = "I'm b!";

    public $c;

}

$obj = new Foo();

echo json_encode($obj);



?>

okay here is another way
this will work on remote server ...

Code:

<!doctype html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" >
<title></title>
</head>
<body>
<script>
function callback(resp){alert(resp.a)}// alerts "I'm a!"
</script>
<script src = "json.php"></script> 
</body>
</html>

the json.php

PHP Code:


			
<?php

class Foo

{

    public $a = "I'm a!";

    public $b = "I'm b!";

    public $c;

}

$obj = new Foo();

echo "callback(".json_encode($obj).")";



?>