Explain the common methods of sending request to a server in jQuery
Last Updated :
28 Apr, 2025
In this article, we will see the common methods of sending requests to a server by using the jQuery library. jQuery is an open-source JavaScript library jQuery simplifies HTML document traversing and manipulation, browser event handling, DOM animation, Ajax interactions cross-browser JavaScript development.
Common methods of Sending Requests to the Server: jQuery has two methods get() and post() that method used for sending get request and post requests to the server.
- The first method is the get() way which is used to retrieve data from the server. The get() method may return cached data.
- The post () method can also be used to retrieve the data from the server. However, post always uses sending the data to the server, and the Post method never caches the data.
Using the jQuery get() method to send the request to the server: The $.get() method loads data from the server
Syntax:
$.get(url,callback);
Parameters:
- Url: The required URL parameter specifies the URL you wish to request.
- Callback Function: The optional callback parameter is the name of the function to be executed if the request succeeds
Example 1: In this example, we will make a data.txt file. This file will be returned when you click the Get Request Button.
data.txt:
GeeksforGeeks
index.html:
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible"
content="IE=edge">
<meta name="viewport"
content="width=device-width,
initial-scale=1.0">
<script type="text/javascript"
src=
"https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js">
</script>
<title>Get Request Example in JQuery</title>
<script>
$(document).ready(function () {
$('#Get-Method').click(function () {
$.get('data.txt', function (data, status) {
$('#output').append(data);
$('#response').append("Response: " + status);
}, 'text');
});
});
</script>
</head>
<body>
<button id="Get-Method"> Get Request</button>
<p id="output"></p>
<p id="response"></p>
</body>
</html>
Output
Get Method OutputUsing the jQuery post() method to send requests to Server: The post() method loads data from the server or sends the data to the server
Syntax:
$(selector).post(url,data,callback ,data Type);
Parameters:
- Url: The required URL parameter specifies the URL you wish to request.
- data: The data parameter data is sent to the server.
- callback function: The callback function when to be executed if the requests succeed.
- Type: datatype is the type of data.
Example 2: This example uses the post() method for sending the request to the server.
data.php: The file will be called when you click the Post Request Button.
PHP
<?php
echo "GeeksforGeeks" ;
?>
index.html:
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible"
content="IE=edge">
<meta name="viewport"
content="width=device-width,
initial-scale=1.0">
<script type="text/javascript"
src=
"https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js">
</script>
<title>Get Request Example in JQuery</title>
</head>
<body>
<h3>GeeksForGeeks</h3>
<button id="Post-Method">
Post Request Example
</button><br><br>
Response From Server:<h3 id="output"></h3>
<script>
$(document).ready(function () {
$("#Post-Method").click(function () {
$.post('data.php', { name: "GFG" }, function (data, status) {
document.getElementById('output').innerHTML = data;
});
});
});
</script>
</body>
</html>
Output:
Similar Reads
What are various methods to make ajax request in jQuery ? In this article, we will see the various methods to make Ajax requests in JQuery. An Ajax request is made to get a response from a server or external website. Ajax Request and Response is the communication between the client and server. jQuery's AJAX methods allow you to request text, HTML, XML, or
4 min read
How to send a PUT/DELETE request in jQuery ? To send PUT/DELETE requests in jQuery, use the .ajax() method, specifying the type as PUT or DELETE. This enables updating or deleting server resources via AJAX. Unlike .get() and .post(), jQuery lacks dedicated .put() and .delete() methods.ApproachTo make a PUT or DELETE requests in jQuery we can u
2 min read
What is the use of jQuery.ajax() method? AJAX is an important concept that must not be missed if you are learning front-end web development. It is an important aspect of the JavaScript programming language that allows the website to make requests to the server and exchange data without disturbing the page, that is without having it reload.
6 min read
How to Send FormData Objects with Ajax-requests in jQuery ? In this article, we will see how can we send formData objects with Ajax requests by using jQuery. To send formData, we use two methods, namely, the FormData() method and the second method is serialize() method. The implementation of Ajax to send form data enables the submission of data to the server
4 min read
How to get server response from an AJAX request using jQuery ? In this article, we will see how we can use jQuery to get the server response to an AJAX request. The jQuery ajax() method implements the basic Ajax functionality in jQuery. It communicates with the server via asynchronous HTTP requests. Syntax:$.ajax(url);$.ajax(url,[options]);Parameters:url: A URL
4 min read
How to Send an HTTP POST Request in JS? We are going to send an API HTTP POST request in JavaScript using fetch API. The FetchAPI is a built-in method that takes in one compulsory parameter: the endpoint (API URL). While the other parameters may not be necessary when making a GET request, they are very useful for the POST HTTP request. Th
2 min read