Asynchronous JavaScript and XML (AJAX) was the base building block of Single Page Applications (SPAs). This method is used to update the content of a web page without reloading the whole page. This method helps save precious resources and decreases the time taken for loading a page considerably, since only parts of the page are reloaded and not the entire page.
More than often, you have visited the Google search page for searching answers to your questions. Have you noticed how the page displays results as you type into the search box and provides useful suggestions of related searches? Or the product filters on Amazon and Ebay websites. These effects are achieved with AJAX.
The
load()
method loads data from a server and puts the returned data into the selected element.
Its syntax is as follows:
$(selector).load(URL,data,callback);
The load()
method take the URL
, data
, and callback
as parameters.
The callback
parameter can have the following parameters:
responseTxt
: This parameter contains the resulting content when successfulstatusTxt
: This parameter contains the status of the request, that is, success
, notmodified
, error
, timeout
, parsererror
xhr
: This parameter contains the XMLHttpRequest
objectThe Get
request gets the data from the server with an HTTP GET
request:
GET
: This requests data from a specified resourceIts syntax is as follows:
$.get(URL,callback);
The Get
request gets the data from the server with an HTTP GET
request:
$.get("Sample.html", myfunction(data)
The required HTML file is as follows:
<p> This is the data from the Sample.html file</p>
The preceding code will fetch the data from the html file and the line This is the data from the Sample.html will be displayed in an alert box on triggering.
The Post
request gets data from the server with an HTTP POST
request:
POST
: This requests data from a specified resourceIts syntax is as follows:
$.post(URL, data, callback);
This takes URL
, data
, and callback
as parameters. Here, the data
and callback
parameters are optional.
This gets data from the server with an HTTP POST
request:
$.post("Sample.html", myfunction(data)
The required HTML file is as follows:
<p> This is the data from the Sample.html file</p>
The preceding code will fetch the data from the HTML file and This is the data from the Sample.html will be displayed in an alert box when triggered.
3.14.131.47