This is an overview of the jQuery AJAX plugin. The plugin itself provides basic HTML and XML retreival functionality. It is especially designed to cover most common use cases for Javascript developers, to remove their dependancies on popular, bloated, AJAX libraries.
Some AJAX Plugin Demos are available, if you're curious as to how the plugin works in a real situtation.
You should consider ProgressiveEnhancement when ajaxifying your forms.
load(URI)
Description
This method retrieves the HTML file located at the specified URL and loads it into the matching elements. This technique is commonly referred to as AHAH.
Any <script> blocks within the loaded HTML are evaluated.
Examples
$("p").load("/test/ajax-test.html");
load(URI,Params,Callback)
Description
There are two optional methods to the load method, Params and Callback. Either one is optional, so it's perfectly valid to call the function like: load(URI,Callback).
These two parameters provide the ability to send a POST request to a server (Params) or receive notification whenever the file has finished loading (Callback).
Any <script> blocks within the loaded HTML are evaluated.
Examples
Using the Params argument to pass additional information to a dynamic script:
$("p").load("test.cgi",{
name: "John",
address: "123 Main St."
});
Waiting for notification whenever the file has been loaded, using the Callback parameter:
$("p").hide("fast");
$("p").load("/test/ajax-test.html",function(){
$("p").show("fast");
});
Helper Functions
The following functions can be used to dynamically load XML documents, which can then be processed using a typical jQuery $() function. These functions are very lightweight and can be considered a good replacement for a library, such as Moo AJAX.
$.get(URI,Callback)
Description
This method is capable of querying the specified URI and returning the resulting XML document to the specified Callback function.
Examples
$.get("/test/ajax-test.xml",function(xml){
alert( $("title",xml).text() );
});
$.post(URI,Params,Callback)
Description
This method is very similar to the $.get function but allows for additional parameter data to be passed as a POST request.
Examples
$.post("test.cgi",{
name: "John",
address: "123 Main St."
},function(xml){
alert( $("title",xml).text() );
});
$.ajax(Hash)
Hash Details
Description
A general AJAX wrapper for all sorts of AJAX functions. There are functions for more specific AJAX functions (get, load, the various forms functions), but the AJAX wrapper allows fine-grain control over ((over what? something seems to be missing here.))
Examples
$.ajax({
url: "mydomain.com/url",
type: "POST",
data: $.param( $("#form").formdata()),
complete: myAjaxDone,
success: myAjaxSuccess,
error: myAjaxError
});
The code above requires the forms plugin, which is distributed with jQuery.
$(expression).ajaxStart(Function)
Description
Attaches a function to the start of AJAX calls. It will fire when there are no other AJAX calls in progress, and one is started.
This can be used (in combination with ajaxStop) for loading animations.
$(expression).ajaxStop(Function)
Description
Attaches a function to the end of AJAX calls. It will fire when all AJAX calls have completed.
Notes
Like other jQuery functions, ajaxStart and ajaxStop are chainable, and return the jQuery object passed in.
Examples
$("#busy")
.ajaxStart(function(){
$(this).show(500);
})
.ajaxStop(function(){
$(this).hide(500);
});