Explanation of Jquery get/post with Example.

The jQuery get() and post() methods are used to request data from the server with an HTTP GET or POST request.

The two most commonly used methods for a request-response between a client and server are: GET and POST.

  • GET – Requests data from a specified resource
  • POST – Submits data to be processed to a specified resource

GET is basically used for just getting (retrieving) some data from the server. Note: The GET method may return cached data.

POST can also be used to get some data from the server. However, the POST method NEVER caches data and is often used to send data along with the request.

jQuery $.get() Method

The $.get() method requests data from the server with an HTTP GET request.

Syntax:

$.get( url, [data], [callback], [type] )

Parameters

  1. url : String containing the URL at which request is to be sent
  2. data : This is an optional parameter that represents key/value pairs that will be sent to the server.
  3. callback: This optional parameter represents the function that is to be executed whenever the data is loaded successfully.
  4. type : This parameter represents type of data to be returned to the callback function i.e “xml”, “script”, “json”, “html”, or “text”.

Example :-

This PHP code is use to get data when below HTML program send the HTTP GET request.

// get.php file
<?php
if( $_REQUEST[“name”] ) {

$name = $_REQUEST[‘name’];
echo “Welcome “. $name;
}

?>

HTML PARTS :-

This HTML code is use to send the HTTP GET request.

<script type="text/javascript">

    $(document).ready(function() {

    $("#driver").click(function(event) {
            $.get(
            "get.php", {
                name: "roshan"
            },
            function(data) {
                $('#stage').html(data);
            });
        });
    });
</script>

Click on the button to load get file

<span id="stage"
    style="background-color:#cc0;">
    Roshan Kumar Jha
</span>

<div>
    <input type="button"
        id="driver"
        value="Get Data" />
</div>

jQuery | post() Method

The post() method in jQuery loads the page from server using POST HTTP request and returns XMLHttpRequest object.

Syntax:

$.post( url, data, callback_function, data_type )

Parameters: 

  • url: It is the required parameter and used to send the request.
  • data: It is optional parameter and it represents key/value pairs of data that will be sent to the server.
  • callback_function: It is optional parameter and it represents a function to be executed when the data is loaded successfully.
  • data_type: It is optional parameter and it represents a type of data to be returned to callback function: xml, html, script, json or text.
  • main.php: This PHP file call in the below example when button pressed.

Example :-

Use post() method and call a PHP file.

// main.php file

<?php

    echo"Hello Roshan!";

?>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">
 <h2 id="rk">Roshan Kumar jha</h2> 
<button id="submit">
    Click Here!
</button>

<!-- Script to use post() method -->
<script>
    $(document).ready(function() {
        $("button").click(function() {
            $.post("/submit.php", {
                name: "Roshan",
            },

            function(data,status) {
                document.getElementById("rk").innerHTML
                        = data;
                document.getElementById("submit").innerHTML
                        = "Data Passed";
            });
        });
    });
</script>

Related Posts

The Architecture of Intelligent DataOps: From Ingestion to Automation

Introduction Modern organizations run on distributed data ecosystems. On any given day, an enterprise environment ingests, transforms, and serves petabytes of records sourced from transactional databases, external…

Read More

Transforming Data Reliability: How DataOps Platforms Drive Proactive Monitoring

Introduction Traditional monitoring focuses almost entirely on infrastructure availability and binary job execution states—whether a server is up or whether a task completed. However, modern distributed environments…

Read More

Navigating Pipeline Risks with Expert DevSecOps Consulting Services

Software delivery moves faster today than at any point in technological history. High-performing engineering organizations push code changes to production multiple times a day using automated deployment…

Read More

DevOps Support Services: Key Practices for Stable Production Environments

Introduction Running modern software infrastructure is an ongoing responsibility. A development team may successfully launch an application, but keeping that application reliable in production requires continuous attention….

Read More

DevOps Learning Paths for Kubernetes, Cloud, Security, SRE, and MLOps

Introduction DevOps has become an important part of modern software engineering because development teams are expected to release software quickly without losing control over quality, security, or…

Read More

Best Practices for Multi-Cloud Tool Integration: A Practical DataOps Guide

Introduction Modern organizations rarely rely on a single cloud provider. As enterprise data architectures evolve, teams frequently operate across combinations of Amazon Web Services (AWS), Microsoft Azure,…

Read More