• jQuery AJAX get and post Methods

    jQuery AJAX get and post Methods

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

    Two commonly used methods for a request-response between a client and server are:

    • 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 sever with an HTTP GET request.

    Syntax:

                    $.get(URL,callback);

    URL The required URL parameter specifies the URL you wish to request.
    callback Parameter is the name of a function to be executed if the request succeeds.

    jQuery $.post() Method:

    The $.post() method requests data from the server using an HTTP POST request.

    Syntax:

                    $.post(URL,data,callback);

    URL The required URL parameter specifies the URL you wish to request.
    data Parameter specifies some data to send along with the request.
    callback Parameter is the name of a function to be executed if the request succeeds.

    Example:

    jQuery AJAX Get() and Post() Method Program Code

    Here is how the “demoGet.php” file looks like:

    jQuery AJAX Get() Method Example

    jQuery AJAX Get() Method Example

    <?phpprint “Wel-come to world of www.4gl-tutorials.com”.”\n”;?>

    Here is how the “demoPost.php” file looks like:

    jQuery AJAX Post() Method Example

    jQuery AJAX Post() Method Example

    <?php$authorName = “”;$authorCountry = “”;$authorName = $_POST[‘aName’];

    $authorCountry = $_POST[‘aCountry’];

     

    print “$authorName is an author of www.4gl-tutorials.com”.”\n”;

    print “Wel-come to, $authorCountry is an author Country…”;

    ?>

    For $.get(), the first parameter of $.get() is the URL we wish to request “demo.html”.

    The second parameter is a callback function. The first parameter of callback function holds the content of the page requested, and the second parameter of callback function holds the status of the request.

    For $.post(), the first parameter of $.post() is the URL we wish to request “demo.asp”.

    In second parameter, we pass in some data to send along with the request (Author Name and Country).

    The html script in “demo.html” reads the parameters, process them, and return a result.

    The third parameter is a callback function. The first parameter of callback function holds the content of the page requested, and the second callback parameter holds the status of the request.

    <script src=”js/jquery-1.11.3.min.js” type=”text/javascript”></script><script>$(document).ready(function(){$(“form”).submit(function(event){event.preventDefault();

    //Among 2 Submit buttons find the particular

    var btn = $(this).find(“input[type=submit]:focus”);

    //alert(btn.val());

    switch(btn.val())

    {

    case “GET Content”:

    $.get(“demoGet.php”,function(data,status){

    alert(“Data: ” + data + “\nStatus: ” + status);

    });

    break;

    case “POST Content”:

    $.post(“demoPost.php”,

    {

    aName:”4glTutor”,

    aCountry:”India”

    },

    function(data,status){

    alert(“Data: ” + data + “\nStatus: ” + status);

    });

    break;

    }

    });

    });

    </script>

    Appreciate my work :Share on FacebookShare on Google+Tweet about this on TwitterShare on LinkedInPin on PinterestShare on RedditShare on StumbleUponShare on TumblrDigg thisShare on YummlyShare on VKFlattr the authorBuffer this page

Leave a Reply

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