0% found this document useful (0 votes)
39 views14 pages

Front End II

This document provides an introduction to front-end development using AJAX (Asynchronous JavaScript and XML). It discusses what AJAX is, how it allows asynchronous requests and responses without page refreshes, and some examples of early AJAX applications from Google. It also covers jQuery's load() function for loading HTML content, formatting data for AJAX requests, processing server responses, and sources for further information.

Uploaded by

benackerman
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
39 views14 pages

Front End II

This document provides an introduction to front-end development using AJAX (Asynchronous JavaScript and XML). It discusses what AJAX is, how it allows asynchronous requests and responses without page refreshes, and some examples of early AJAX applications from Google. It also covers jQuery's load() function for loading HTML content, formatting data for AJAX requests, processing server responses, and sources for further information.

Uploaded by

benackerman
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 14

Lesson IX: Front-end Development

XML and JavaScript (AJAX) AJAX as a Concept Some examples of AJAX (introduction to GWT) Introduction to EXT js (comparison with AJAX)

What is AJAX?
AJAX was originally coined in 2005 to capture new sites that were coming from Google Google Maps (http://maps.google.com), Gmail (www .gmail.com), and Google Suggest (www.google.com/webhp?complete=1&hl=en) . AJAX means Asynchronous JavaScript and XML, but it isnt an official technology like HTML, JavaScript, or CSS.

What is AJAX?
In very simple terms, current browsers allow you to use JavaScript to send requests to a server and display the responses without refreshing your page. The JavaScript program takes that data, and does something with it. For example, if youre on a Google Maps page and click the north arrow button, the pages JavaScript requests new map data from the Google server. That new information is then used to display a new chunk of the map.

What is AJAX?

What is AJAX?

What is AJAX?

load() function
The most basic Ajax function given by jQuery is load(). This function loads an HTML file into an element in the page.

The load() function


We simply select first the container that we want to fill with the HTML content.

Formatting Data to be Sent

The encodeUriComponent()

Object Literal

Object Literal
For short and simple data access that do not have any punctuation symbols, you can use a query string. But when you want to have a bullet proof to access data, an object literal is best.

Processing Data from the Server


When the browser sends of a request to the server using the XMLHttpRequest object it keeps on listening for a response from the server until a callback function handles the servers response. You can format the returned data in anyway you please. Normally the server returns. Normally the server sends a lot of information formatted in XML or JSON. The second argument to the callback function is a string indicating the response status. Normally this is either a success or an error.

Sources
http://www.adaptivepath.com/ideas/ajaxnew-approach-web-applications JavaScript and jQuery the Missing Manual David Sawyer McFarland

You might also like