Using jQuery POST

The jQuery POST allow passing parameters to other file and then process the returned data. This is better to see how jQuery POST works with an example.

I have two files:

  • jquery-example-using-post.php
  • myForm.php

Here’s the file contents of jquery-example-using-post.php:

<head>
<title>Using jQuery POST</title>

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
    $("document").ready(function() {

        // Send a POST request to myForm.php with 2 parameters
        $.post("myForm.php", {name: "Alex", age: "42"}, function(tData) {

                    // Get the data from myForm.php and post the results below
                    $("#simpleDiv").html(tData);

            });

    });
</script>

</head>
<body>

<h2>Using jQuery POST</h2>

<div id="simpleDiv">hi</div>
</body>
</html>

When visitors access jquery-example-using-post.php, it will send a request to myForm.php.

The file contents of myForm.php is:

<html>
<head>
<title>My Form</title>

</head>
<body>

<h2>My Form</h2>

<?php

    echo "Name is: " . $_POST["name"] . "<br/>";
    echo "Age is: " . $_POST["age"];

?>

</body>
</html>

The file myForm.php will then process the request from jquery-example-using-post.php. And then jquery-example-using-post.php process the returned data from myForm.php.

The results is shown as below:

Demo:

jQuery Example File:

Click here to download.

With the using of jQuery POST, more complicated application can be made easily.

Leave a Reply

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

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>