Description
jQuery Method strongly provides methods or functions for Ajax Development. The term AJAX is Asynchronous Javascript And XML.From server, jQuery Ajax will fetch the content in the background and updates the parts of web page without reloading the whole page.
jQuery with Ajax fetches data using
GET or POST method by including TXT, HTML, XML. Description
jQuery Ajax has a powerful function called
load() which is used to load the static or dynamic data from server and returned into the selected elements of HTML document. Description
Here syntax of load() method
$(selector).load(url,data,[callback]);
whereurl: The documents which are requested will are located using URL.data: This parameter can be used optionally. It is use to add the query strings(data) with requested url.callback: This is an optional parameter. Callback function to be invoked whenever effect is completed.
Example
[javascript]
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("#div1").load("demo_test.txt");
});
});
</script>
</head>
<body>
<div id="div1"><h2>Let jQuery AJAX Change This Text</h2></div>
<button>Get External Content</button>
</body>
</html>
[/javascript]
Output:
Table
JQuery provides a rich set of Ajax methods to develop the web application.
| Method | Description |
|---|---|
$.ajax(options) |
With the help of HTTP request, a remote page is loaded using this method. |
$.ajaxSetup(options) |
This method will setup settings globally for AJAX requests. |
$.get(url,[data],[callback],[type] ) |
This method loads URL for the document requested to open using GET. |
$.getJSON(url,[data],[callback]) |
The method loads JSON data with the help of HTTP GET request. |
$.getScript(url,callback) |
The method loads and executes a JavaScript file utilizing HTTP GET request. |
$.getJSON(url,[data],[callback]) |
The method loads JSON data utilizing HTTP GET request. |
$.post(url,data,callback,type) |
The method loads URL for the document requested to open utilizing POST. |
load(url,[data],[callback]) |
The method loads HTML from a remote file and inject it into the DOM. |
serialize() |
The method serializes a group of form input elements into a data string. |
serializeArray() |
Like the .serialize() method, this method also serializes all forms and form input elements but it returns a JSON data. |
Table
AJAX events are listened by a group of AJAX function which are declared globally across all AJAX requests sent via jQuery. The following are global AJAX functions.
| Method | Description |
|---|---|
ajaxComplete( callback ) |
ajaxComplete method add to the function, when AJAX request completes than execute. |
ajaxStart(callback) |
ajaxStart method add to the function, when AJAX request begin than execute. |
ajaxError(callback) |
ajaxError method add to the function, when AJAX request fails than execute. |
ajaxSend(callback) |
Add a function that has to be executed before an AJAX request is sent. |
ajaxStop(callback) |
ajaxStop method add to the function, when AJAX request stop than execute. |
ajaxSuccess( callback ) |
ajaxSuccess method add to the function, when AJAX request successfully completed than execute. |
Key Points
- Ajax will fetch the content in the background and updates the parts of web page without reloading the whole page.
- load() function loads the static or dynamic data from server and returned into the selected elements of HTML document.