6 Comments »

The purpose of this post is to try to explain AJAX the way I understand it. To me,
AJAX is not some complicated technology that you need to go out and buy books to
learn. Rather, it is simply two or more web pages, and a couple of simple Javascript
functions.I have come to hate the term AJAX. It seems every time I mention AJAX, either
developers get nervous, or account managers get excited. Neither situation benefits me.
Actually, I’ve pretty much stopped using the term at all. Depending on my audience, I’ll
make up different terms. Like when I’m talking to Java developers, I’ll say “we need to do
a back end call” and that doesn’t freak them out, but telling them we need to do an AJAX
call makes them sweat.

Hopefully, if enough people read posts like this, the mystery and glamor will be removed
from the term AJAX. So, lets get to the de-mystification.

First, lets dissect the name itself. A.J.A.X.


A = Asynchronous


J = Javascript


A = And


X = XML

Most developers reading this will feel pretty comfortable with the Javascript part.
It’s the asynchronous and the XML parts that make most people nervous. They really
shouldn’t. I’ll briefly describe each, then we’ll put it all together.

Asynchronous simply means “lets open another URL without changing or reloading the page.”
Picture it like this… You are reading a blog post, and you come across a link to another page.
You don’t want to stop reading, so you right click the link and open it in a new window or another
tab right? Now you continue reading the page you were on. Asynchronous simply means we are doing
something else without disturbing the page we are viewing.

Javascript, we all know what that is I hope. If you don’t, then you should probably be reading
some other sites first (intro to Javascript).
Now, the purpose of this post is to make AJAX easy to write, and easy to understand, so we are
going to use Javascript tools that make our job a lot easier. Whenever I write AJAX code, I always use
the Prototype Javascript framework.
Go ahead and download it, we’ll talk more about it later, just know that it has most of the Javascript
we will need built in.

Before I get into XML, and what it is, I would like to note that AJAX doesn’t even need XML to work.
For those who can’t or won’t use XML, don’t worry, you can still write useful AJAX code without it, but
please continue reading and maybe you will decide that you can use XML after all. It does make AJAX a
lot easier, but like I said, it’s not necessary.

XML shouldn’t be scary, but many people just don’t know what it is. If you’ve got this far and you
aren’t totally confused, then you probably know how to write HTML. HTML and XML should not necessarily
be compared, but they are similar in how they are written. XML is written using ‘tags’ similar to HTML.
And XML tags need to be “balanced” just like HTML should be. Following is some simple HTML:

<html>
  <head>
    <title>sample</title>
  </head>
  <body>
    <div>something</div>
  </body>
</html>

Most people will recognize this as the most basic of HTML code, but what you may not know is that
this could also be valid XML code as well. I mentioned the word “balanced” earlier. In the sample
above, you will notice that each tag has a corresponding ending tag like <html></html>.
That is what balanced means. That is probably the most important concept in XML. Unlike HTML, we don’t
necessarily use XML for presentation, XML is normally used more like a database. For example, if the
code above were an XML file, and we wanted to think of it as data, we could say that the <html>
section could be the database itself, the <head> section could represent a table in that database,
the <title> section could represent a column in that table and the word “sample” would be the value
of that column. If it were a database, we could query it something like this…

select title
from html.head

We could spend a great deal of time explaining XML, but lets just says that its basic function is to
store data and to define what that data means. So, in the example above, the word “sample” means, and
we know this because of the XML tags we use to surround it, it is the ‘title’ of the ‘head’ of the ‘html’ file.

I’ll write one more sample XML just for clarification because I think I’ve spent too much time on
this subject already, but I think one more sample will be helpful in describing just how easy XML is.
Lets say we want to get a list of books. We could represent that list of books with XML.

<books>  
  <book>     
    <title>The Shining</title>     
    <author>Stephen King</author>     
    <ISBN>0743437497</ISBN>     
  </book>     
  <book>     
    <title>Fahrenheit 451</title>     
    <author>Ray Bradbury</author>     
    <ISBN>9506440298</ISBN>     
  </book>     
</books>

From that example, XML should be pretty self explanatory. And that is the real point of XML.

That concludes “AJAX Fast and Easy – part one”. In part two, we will build a basic HTML file
and make an AJAX call to another basic HTML file, leaving the XML part out of the equation.

UPDATE:


Ajax Fast and Easy – part two is now available

 



Tags: , , , , , , , , ,

Trackback URL | Comments RSS

6 Responses to “AJAX Fast and Easy – part one”
 

Very insightful…I feel like I can code!

Matt Levy wrote on February 20th, 2008 at 3:47 pm

 

[…] AJAX Fast and Easy – part one […]

 

[…] AJAX Fast and Easy – part one […]

 

[…] In AJAX Fast and Easy – part one, we defined AJAX and decided it wasn’t really that complicated. In AJAX Fast and Easy – part two, we created an index.html file, a backendHTML.html file and we downloaded the Prototype Javascript framework. We put them all together and made some ajax magic happen. However, in part 2 we left out all the junk about XML, and all we really did was display the ajax results as an alert. Not too useful, but it proved the point and it was pretty fun. […]

 

[…] AJAX Fast and Easy – part one » position:relative – a Web and Now blog Hopefully, if enough people read posts like this, the mystery and glamor will be removed from the term AJAX. So, lets get to the de-mystification. […]

 

[…] AJAX Fast and Easy – part one » position:relative – a Web and Now blog Hopefully, if enough people read posts like this, the mystery and glamor will be removed from the term AJAX. So, lets get to the de-mystification. […]


 




  • big sean bullshittin instrumental download
  • canon mp190 treiber download xp
  • adaptador wireless usb 802.11n download
  • business plan pro download crack
  • catedral o sentido download
  • asus wl 138g v2 pci driver download
  • bulent ersoy free download mp3
  • bison cam program download
  • 1und1 fritzbox firmware download
  • bottoms up mp3 download link
  • best mmo games without download
  • breaking the habit karaoke download
  • black swan book download free
  • bleach cap 348 ita download
  • andaikanku harus memilih mp3 download
  • aristotle on the soul download
  • bcom download samsung flash wiki
  • alcohol 110 gratis download
  • aspire 5315 drivers download free
  • blacks ops hacks download
  • amarok download for linux
  • circuitos electricos sadiku download
  • artikel sistem informasi akuntansi download
  • borknagar for the elements download
  • a vitoria pixote download
  • civilization 4 colonization download
  • canon pixma mp780 driver download mac
  • canon mp600 software download mac
  • auto download movies music
  • biostar n61pc m2s drivers download
  • canon mf6540 software download
  • chithi na koi sandesh download mp3 free
  • chelsea bayern munich 2012 download
  • abit nf7 s motherboard drivers download
  • ben 10 free download cartoon
  • catatan harian si boy download indowebster
  • aladin songs download mp3 free
  • businessman sir osthara video download
  • arthur y los minimoys download free
  • battle of britain dos download
  • acrobat x pro mac download link
  • beyonce creole download mp3
  • bocelli central park download
  • chana ve kehde mp3 download
  • ceceli bekle mp3 download
  • amor perfeito download claudia leite
  • bloodhound gang discovery channel download free
  • carbon x hd pro 2.1 download
  • brokencyde get up download mp3
  • cd dj antoine 2011 download
  • carlito marron download mp3
  • club penguin money maker download 1.0
  • animal crookers remix download
  • career test software download
  • boney m rivers of babylon 1978 download
  • bibi und die vampire download
  • cardio workout music download
  • ar rahman karuthamma songs download
  • 1und1 outlook exchange download
  • ben 10 alien force wallpaper download
  • ati catalyst 11.6 download win7
  • bloodhound gang balls out download
  • bees gees stayin alive download
  • analise de circuito boylestad download
  • bendito tu corazon download
  • club marian download games
  • cd oferta viva download
  • avril lavigne complicated download gratis
  • acima de qualquer suspeita download gratis
  • christmas carols list download
  • against the grain download bad religion
  • acdsee pro 3 download cnet
  • 11.9 catalyst ccc download
  • arihant integral calculus ebook download
  • andrea bocelli cd download free
  • avg rescue cd iso download
  • ben 10 download for mobile
  • cele mai noi manele download 2012
  • cheat engine v.7.1 free download
  • addictive drums free download windows 7
  • clams casino instrumental mixtape download zip
  • 30 day vegan challenge free download
  • aishiteruze baby download mp4
  • apostila escrevente judiciA?rio download
  • christopoulos suite 2012 download
  • behka ghajini mp3 download free
  • addon ha tra? download youtube
  • brand x music volume 11 download
  • akon smack that download mp3
  • alaipayuthe kanna ringtone download
  • antoine dodson rap song download mp3
  • bug mafia trandafirii download free
  • bedtime baby lullaby download
  • avante bold font download
  • amadeus mozart strauss beethoven download
  • biomedical engineering handbook download
  • canon mp600 download for mac
  • canon eos d20 driver download
  • bewafai album songs 2010 download
  • alegre e triste download
  • business plan pro download free
  • a estrada hd download
  • catedral del mar download
  • bernardo e bianca download rmvb dublado
  • cancion de jackass download
  • android apps bar file download
  • cd aventureiro revelaAA?o download
  • barbra streisand mp3 download bee
  • age mythology download br
  • 112 stay with me mp3 download
  • cd marcos witt download gratis
  • abcd full movie download youtube
  • 30 day shred meal plan download
  • 20 e poucos anos download mp3
  • carmen san diego download baixaki
  • canoscan lide 50 download driver
  • alessio iubirea ta download fisierul meu
  • acelerador de download que funciona no google chrome
  • beogradski sindikat poroci beograda download
  • chup gaye sare nazare download mp3
  • astro vision soulmate free download
  • burna boy tonight mp3 download
  • arde en mi thermo download
  • anaganaga kadhala song free download
  • anas younus new album download
  • 20 years carre cd download
  • chandni songs download pk
  • agachate danny romero download zippy
  • baby giggle sound download
  • ada cinta acha septriasa download
  • bozic bozic blagi dan download mp3
  • acerto de contas download
  • carbide ui 4.0 free download
  • aircrack ng free download for linux
  • cavaleiro solitario download dublado clint
  • clinical paediatrics ebook download
  • chal rehn de mp3 download
  • clinically oriented anatomy moore download
  • asus rt n13u manual download
  • ashwini movie songs download