Search within TutorialsPark

Jquery Advanced Ajax Methods


Learn to use Advanced Ajax Methods to exchange Data seamlessly


jQuery Ajax : Using the $.ajax() Method

The jQuery method $.ajax(property1:value, property2:value) is the mother of all Ajax Methods, all other methods like $.get() and $.post() in the background use the $.ajax() to get the job done, since all other methods lack advanced features.

The method accepts a JavaScript object as its parameter, with various configuration settings to be used while making an Ajax request, there are 20 such options available.

Table : Jquery ajax() Configuration Settings

Selector Description
async To Govern whether Ajax request are made asynchronously or synchronously. Default value of async is true
contentType To set the MIME content type of the data that accompanies a request.
data The Data accompanying a request
datatype To specify the the type of data expected from the server as a response. Eg: html, xml, json etc.
error To specify a function that gets called if a request fails.
username To specify a username incase the request needs authentication.
password To specify a password incase the request needs authentication
sucess To specify a function that gets called when a request is successful.It gets the data from the server as its parameter.
timeout To specify the timeout duration in milliseconds. It a request takes more time than the specified value, the request is rejected.
type To specify the type of request: GET, POST, PUT or DELETE. Default value is GET
url To specify the resource on the server to which the request is to be made.

jQuery Ajax: Downloading Text using $.ajax() Function

In the Demo below, the $.ajax() is used to download and then subsequently display the contents of the file demoMsg.txt.

After displaying the text content, using $.ajax() a callback function is called, indicating that the Ajax operation was successful.

Example: Downloading Text using $.ajax() Function

Give it a TRY! » Note: The method parent() can go only one level up the DOM.


jQuery Ajax: Post Data to Server using $.ajax() Function

The jQuery $.ajax() function is used to communicate with the server POST method as well, you can access data without automatically loading it into the wrapped element set.

The demo below, uses $.ajax() to send data to the server using POST method and then displays the result.

Example: Post Data to Server using $.ajax() Function

Give it a TRY! » Note:The method parents() selects all parents.


jQuery Ajax : Getting Data from the Server Using $.ajax() Function

The jQuery $.ajax() can also be used to communicate with the server using GET method. It enables you to access data seamlessly without having to refresh page.

The demo below uses the $.ajax() to send data to the server using thr GET method and then display the result.

Example: Getting Data from the Server Using $.ajax() Function

Give it a TRY! » Note:If no matches are found , then all the ancestors are selected.


jQuery Ajax : Using the $.ajax() Method

The jQuery method $.ajax(property1:value, property2:value) is the mother of all Ajax Methods, all other methods like $.get() and $.post() in the background use the $.ajax() to get the job done, since all other methods lack advanced features.

The method accepts a JavaScript object as its parameter, with various configuration settings to be used while making an Ajax request, there are 20 such options available.

Example: jQuery Method ajax()

Give it a TRY! » Note:It returns a wrapped set containing the single nearest ancestor that matches the passed expression.


jQuery Ajax: jQuery stop() Method

The jQuery method stop() is similar to closest() method, it finds the first ancestor that has a value for the CSS position property of relative , absolute or fixed.

These elements are known as positioned ancestors , these properties can be used while working with animation.

Example: Selecting Ancestors using offsetParent() Method

Give it a TRY! » Note:This method works its way up the hierarchy until it reaches an element with one of the required values.


jQuery Effect : jQuery delay() Method

The jQuery method delay() is used to delay all unexecuted functions in the named queue.

Example: jQuery delay() Method

Give it a TRY! » Note:This method works its way up the hierarchy until it reaches an element with one of the required values.