Intro to JSON

A-json.js

//WHAT IT LOOKS LIKE

//Javascript and json objects are written inside "{ }"

var bar = { name: "foo" , city: "SanDiego" };

var data = { sand: true , water:"Clear" , extra: bar };  //bar is the above object


/*******************************************/
//Getting the data from json

var watervale = data.water; //watervalue = "clear"

var namevalue = data.extra.name; //namevalye = "foo"


/*****************************************************************************************/
/*****************************************************************************************/
//This contains objects with an array of multiple objects inside

                            //props[0]                    props[1]
var bar = { props: [{foo:"bar" , kind:"beach"} , {me:"you" , flag:true }] , help: false };

var data = { sand: true , water:"Clear" , extra: bar };

/*******************************************/
//Getting the data

var x = data.extra.props[0];  //x = {foo:"bar" , kind:"beach"}

alert(x.kind);  //alert "beach"

//Changing the value in javascript would be
x.kind = "anothervalue";

//NOTE: keys can also be in ""

get_data.php

//Returning data from your database in JSON

//You need to add this to the script that will be called (ex.using AJAX) to get you the data
header("Content-type: application/json");

//example
$my_obj = '{ items:[key1:"value1", {key2:"value2" , key3:"value3"}], help:false  }';

$count = 2;

//Convert any array to JSON format
echo json_encode(array("items" => $my_obj , "count" => $count));

//The above will output
{ items: $my_oj , count:2 }

using_jquery.js

//Get data

//funtion is the callback funtion when the data are available
//data is the object returned
$.getJSON("the_URL_of_the_scipt.php" , funtion(data){
  
  var item = data.items[0];
  
  alert(item.key);
  });