Home >>jQuery Tutorial >jQuery $.ajax() Method

jQuery $.ajax() Method

jQuery $.ajax() Method

jQuery ajax() method in jQuery is used to perform an AJAX (asynchronous HTTP) request where the other methods cannot be used.

Syntax:
$.ajax({name:value, name:value, ... })

The parameters specify a name / value pair or more for the AJAX request.

Possible names / values in the following table:

Here is an Example of jQuery ajax() Method:
Name Value/Description
Async A Boolean value which indicates whether or not the request should be treated asynchronously. Defaults to be true
beforeSend(xhr) A function to run before you send a request
Cache A boolean value which indicates whether the browser should cache the pages requested. Defaults to be true
complete(xhr,status) A function to run when the request is complete (after function success and error)
contentType Type of content used when sending data to server. Default is: "application / x-www-form-urlencoded"
Context Specifies the "this" value for all callback functions associated with AJAX
Data Specifies which data to send to the server
dataFilter(data,type) A function used to handle XMLHttpRequest raw response data
datatype The type of data the server response would expect.
error(xhr,status,error) If the request fails a function to run.
Global A boolean value for the request specifying whether or not to trigger global AJAX events. Defaults to be true
ifModified A Boolean value that specifies whether a request is successful only if the answer has changed since the last request. By default: false
Jsonp A string which overrides the callback function in a request for jsonp
jsonpCallback In a jsonp request, specifies a name for the callback function
Password Specifies a password to use on an authentication request for HTTP access.
processData A Boolean value specifying whether the data sent with the request should be converted into a query string or not. Defaults to be true
scriptCharset Specifies the required charset
success(result,status,xhr) A function to run when the request is successful
Timeout Local timeout to request (in milliseconds)
Traditional A Boolean value specifying whether to use the traditional param serialisation style or not
Type Specifies the Request type. (POST, or GET)
url Specifies the URL you want to send to. By default, the current page is
Username Specifies the username to use in an authentication request for HTTP access
Xhr A function used to create the object XMLHttpRequest

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$(".btn1").click(function(){
$.ajax({url: "demo_test.txt", success: function(result){
$("#box").html(result);
}});
});
});
</script>
</head>
<body>
<div id="box"><h2>Let jQuery AJAX Change This Text</h2></div>
<button class="btn1">Click me to Get External Content</button>
</body>
</html>

Output:

Let jQuery AJAX Change This Text