jQuery $.post() method is used to request data from a webpage and to display the returned result (sent from requested page) on to that webpage from where the request has been sent without page refresh.

$.post() method sends request along with some data using an HTTP POST request.

Under this, a request is send to a webpage (here it is jquery_post.php) from another page (say jquery_send.php) using syntax :



$.post( URL, data, callback);



  • URL

The URL parameter is defined for the URL of requested page which may communicate with database to return results.



  • data

The data parameter is defined to send some data along with the request.

,{   // Data Sending With Request To Server


  • callback

The callback parameter is defined for a function to be executed if the request gets succeeded. This contains two sub parameters , the first one holds the returned data from the requested page and  second one holds the status of the request.

,function(response,status){ // Required Callback Function
//"response" receives - whatever written in echo of above PHP script.
alert("*----Received Data----*\n\nResponse : " + response+"\n\nStatus : " + status);


Note : Both ‘ data ‘ and  ‘ callback ‘ parameters are optional parameters, whereas URL is mandatory for $.post() method.


Below is our complete code with download and live demo option



The following example uses the $.post() method to send some data along with the request.

This is jquery_send.php page that contains jQuery $.post() method which can be implemented as given below:

<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro|Open+Sans+Condensed:300|Raleway' rel='stylesheet' type='text/css'>
<!-- Include JS File Here -->
<link href="style.css" rel="stylesheet"/>
<!-- Include JS File Here -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
var vname = $("#name").val();
var vemail = $("#email").val();
if(vname=='' && vemail=='')
alert("Please fill out the form");
else if(vname=='' && vemail!==''){alert('Name field is required')}
else if(vemail=='' && vname!==''){alert('Email field is required')}
$.post("jquery_post.php", //Required URL of the page on server
{ // Data Sending With Request To Server
function(response,status){ // Required Callback Function
alert("*----Received Data----*\n\nResponse : " + response+"\n\nStatus : " + status);//"response" receives - whatever written in echo of above PHP script.
<div id="main">
<h2>jQuery Ajax $.post() Method</h2>
<form id="form" method="post">
<div id="namediv"><label>Name</label>
<input type="text" name="name" id="name" placeholder="Name"/><br></div>
<div id="emaildiv"><label>Email</label>
<input type="text" name="email" id="email" placeholder="Email"/></div>
<button id="btn">Send Data</button>


And here we have “jquery_post.php” file , which contains following PHP codes, that reads the request, processes it  and return the result.

$name = $_POST["name"];
$email = $_POST["email"];
// Here, you can also perform some database query operations with above values.
echo "Welcome ". $name ."!"; // Success Message


For more reference you can visit our below link:

Form Submit Without Page Refreshing-jQuery/PHP



With above tutorial you became familiar with jQuery’s $.post() method. Hope you might have liked it, to learn more & to get more coding tricks keep reading our other blogs.