Tag Archives: post

Basic Ajax usage with jQuery

In this article we will be talking about the basic usage of Ajax with jQuery 1.4.2 production (24KB, Minified and Gzipped).

In order to use the JavaScript examples in this article, you should first download jQuery and include it on your page using:

Throughout this article our Ajax scripts will communicate with ‘serverscript.php‘ our Server script.

Method One – POST (Asynchronous with data):

Transfer data to the server (using POST method), and retrieve a response:

Method Two – GET (Asynchronous with data):

Transfer data to the server (using GET method), and retreive a response:

Note that GET is the default type for Ajax calls using jQuery, so we really do not need to explicitly state it, but I’ve placed it there just for clarity.

Practical jQuery Example using POST:

jQuery Example in Browser

jQuery Example in Browser

Well there you have it, not too tricky and with a weight of only 24Kb for the base library you can’t go wrong. Of course, jQuery can be used for a whole heap of other tasks.

Until next time (when we cover MooTools), Happy A’jaxing!