jQuery Ajax Get Example

jQuery Ajax Get Example

jQuery ajax get method request example; In this tutorial, you will learn what is jQuery ajax $.GET method and how to use this ajax $.GET with example.

jQuery Ajax $.GET Method Request Example

See the following steps for jquery ajax get request example:

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 jQuery 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 Method Request

This example will demonstrate you how to send data to the server along with the request using 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 = "Tutsmake";
    
    $.get('https://www.tutsmake.com/Demos/html/ajax-get-method.php', {webname: name}, function(data){

        $("#output").html(data);
    });

  });

});
</script>
</head>
<body>
    <div class="formClass">
      <button type="button">Click & Get Data</button><br>
      <div id="output">Hello</div>    
    </div>
</body>
</html>                            

Output

Ajax GET Request Example

Hello

Example demonstration of jQuery Ajax $.GET Method

  • 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

  1. jQuery | Event MouseUp By Example
  2. Event jQuery Mouseleave By Example
  3. jQuery Event Mouseenter Example
  4. Event jQuery MouseOver & MouseOut By Example
  5. keyup jquery event example
  6. Jquery Click Event Method with E.g.
  7. Event jQuery. Blur By Example
  8. jQuery form submit event with example
  9. keydown function jQuery
  10. List of jQuery Events Handling Methods with examples
  11. Jquery Selector by .class | name | #id | Elements
  12. How to Get the Current Page URL in jQuery
  13. jQuery Ajax Get() Method Example
  14. get radio button checked value jquery by id, name, class
  15. jQuery Set & Get innerWidth & innerHeight Of Html Elements
  16. jQuery Get Data Text, Id, Attribute Value By Example
  17. Set data attribute value jquery
  18. select multiple class in jquery
  19. How to Remove Attribute Of Html Elements In jQuery
  20. How to Checked Unchecked Checkbox Using jQuery
  21. jQuery removeClass & addClass On Button Click By E.g.
  22. To Remove whitespace From String using jQuery
  23. jQuery Ajax Post Method Example
  24. To Load/Render html Page in div Using jQuery Ajax $.load
  25. jQuery Ajax Loading Spinner Example

AuthorAdmin

My name is Devendra Dode. I am a full-stack developer, entrepreneur, and owner of Tutsmake.com. I like writing tutorials and tips that can help other developers. I share tutorials of PHP, Python, Javascript, JQuery, Laravel, Livewire, Codeigniter, Node JS, Express JS, Vue JS, Angular JS, React Js, MySQL, MongoDB, REST APIs, Windows, Xampp, Linux, Ubuntu, Amazon AWS, Composer, SEO, WordPress, SSL and Bootstrap from a starting stage. As well as demo example.

Leave a Reply

Your email address will not be published. Required fields are marked *