Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

AJAX concept help

Hey guys, I am a little confused at the moment regarding AJAX concepts.

So lets say I just want to make an AJAX request and response between PHP.

What is actually needed in this process? I have watched the first couple of AJAX videos and I'm still a little confused.

I'm still confused why JSON is needed and what exactly JSON is, is it like a SQL table but for the front end?

Can someone explain to me the process of requesting and receiving a response, I am still a little confused and if someone could explain in great and easy detail what the steps are it would be great.

Thanks

3 Answers

JSON isn't absolutely required, its just a way of formatting data in such a way which can make it more human readable (see below).

If your AJAX is calling a php script which is to return data from a Database, php has built in functions to format the results in JSON.

That being said, you can just return a string back to PHP, it all depends on the circumstances your using AJAX in the first place.

Consider a JSON object for a customer and perhaps some information about previous orders. JSON is useful when returning data back from an SQL query back to a php script

{  
   "Client Details":{  
      "Client name":"Chris Jones",
      "DOB":"23/07/1984",
      "Address":{  
         "Address Line1":"Our House",
         "Address Line2":"In the middle of our street",
         "Post/ZIP code":"PO19 9KK"
      },
      "Products ordered":{  
         "Computer hardware":{  
            "Processor":"Intel I7",
            "Memory":"32GB"
         },
         "Computer Software":{  
            "Operating System":"The one thats free",
            "Office software":"Pen and Paper"
         }
      }
   }
}

The predecessor to the above is XML and using the same data as above, would look like this:

<?xml version="1.0" encoding="UTF-8" ?>
    <Client Details>
        <Client name>Chris Jones</Client name>
        <DOB>23/07/1984</DOB>
        <Address>
            <Address Line1>Our House</Address Line1>
            <Address Line2>In the middle of our street</Address Line2>
            <Post/ZIP code>PO19 9KK</Post/ZIP code>
        </Address>
        <Products ordered>
            <Computer hardware>
                <Processor>Intel I7</Processor>
                <Memory>32GB</Memory>
            </Computer hardware>
            <Computer Software>
                <Operating System>The one thats free</Operating System>
                <Office software>Pen and Paper</Office software>
            </Computer Software>
        </Products ordered>
    </Client Details>

I'm sure you'd agree that JSON is much more friendly/easier to read

So what actually is JSON, is it a file that is linked to the HTML document or is it within the document?

Also how would you display your results such as "Computer Software"?

Sorry for being so nooby on this topic, it's a bit of a confusing one.

Dave McFarland
STAFF
Dave McFarland
Treehouse Teacher

Hi nicholas maddren

JSON is really just a bunch of text that's formatted in a way that's easy for a web browser to convert to JavaScript.

In your case, you might have a web page that makes an AJAX request to your web server. The request will point to a specific resource on your server: for example get_data.php. This would just be a PHP page that you create and program. You would program it to return the JSON-formatted data. After the web page sends the request to this page (get_data.php for example), it waits until the server sends back the data. Your php file needs to be programmed to send a text response back.

The php file doesn't have to send JSON. It can send XML as Chris Jones points out. But the php file might just send a sentence or a single word like "submitted." It's up to you to figure out what kind of information you want to receive back from the server and place into the web page. I hope that helps.

The most common use of JSON is something you get from an API like Flickr or Twitter or even Treehouse. In fact all of the data about every badge you've earned on Treehouse is available as one JSON file. http://teamtreehouse.com/nicholasmaddren.json

Once you've got that then you can easily manipulate it like SQL. Something like, get me the date I earned my last badge, calculate how many badges I've earned, get the date I joined Treehouse. You can do all of this using JavaScript.

Another use of JSON is if you want to store more than a variable in local storage.