jQuery ajax GET example; In this tutorial, i am going to show you what is jQuery ajax $.GET method and how to use this jQuery ajax $.GET with parameters example.
jQuery Ajax $.GET Method Example
- What is jQuery Ajax $.GET Method ?
- Syntax of Ajax $.GET Method
- Parameters of jQuery Ajax $.GET Method
- Example – jQuery ajax get request with parameters
What is jQuery Ajax $.GET Method ?
The jQuery ajax $.GET method sends asynchronous http GET request from the server and get the response from the server without reloading/refreshing the whole part of web page.
In the simple words, ajax $.GET method mainly used to send asynchronous http GET request to
send or retrieve/get the data from the web server without reloading/refreshing whole part of web page. It will change or replace the data of whole web page without refreshing the web page.
Syntax of Ajax $.GET Method
jQuery.get( url [, data ] [, success ] [, dataType ] );
Parameters of jQuery Ajax $.GET Method
- url: This is the required parameter. Url is adress where, you want to send & retrieve the data.
- data: This is used to sent some to the server with request.
- success : This function to be executed when request succeeds.
- dataType: dataType is a response content or data expected from the server.
Example – jQuery ajax get request with parameters
See the following example for how to send data to the server along with parameter using the request ajax $.GET method:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Ajax GET Request Example</title>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<style>
.formClass
{
padding: 15px;
border: 12px solid #23384E;
background: #28BAA2;
margin-top: 10px;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(event){
var name = "Latatutorials";
$.get('https://jsonplaceholder.typicode.com/todos/1', {webname: name}, function(data){
$("#output").html(data.title);
});
});
});
</script>
</head>
<body>
<div class="formClass">
<button type="button">Click & Get Data</button><br>
<div id="output">Hello</div>
</div>
</body>
</html>
Demo – jQuery ajax get request with parameters
Hello
Explanation for jQuery ajax get request with parameters
- In this above ajax $.GET method example. The url parameter is first parameter of the $.GET method and it help to send form data from the server using Http GET request.
- The Next parameter data is a data to submit form data in JSON format, In pair of key value.
- Next parameter “success” , When the HTTP GET request is succeeds.
- The dataType parameter is a used to receive the response from the server.
Recommended jQuery Tutorial
Recommended:-jQuery Replace Text in Div,Span, p, Textarea
Recommended:-jQuery Get and Set Input box By Name, Id
Recommended:-Get and Set CSS Property in jQuery
Recommended:-jQuery Insert Content Before or After an Element
Recommended:-jQuery HTML Append Prepend Example
Recommended:-jQuery Remove Text & Element From HTML
Recommended:-jQuery Add Remove Class on onClick
Recommended:-jQuery Set Checkbox Checked
Recommended:-jQuery Get Checkbox Checked Value
Recommended:-Get and Set Data Attribute Value in jQuery
Recommended:-jQuery Get Multiple Checkbox Value
Recommended:-jQuery Remove Attribute Disabled
Recommended:-jQuery Select Multiple HTML Elements
Recommended:-jQuery Get Data Id, Text Attribute Value
Recommended:-jQuery Set and Get width and height Of Element
Recommended:-jQuery Clone/Duplicate Html Elements
Be First to Comment