7tech.co.in
Learn Php, WP, JS, Joomla & jQuery

How to make a jQuery Ajax post request

Still many of you don’t know how to use Ajax, some of you who know how to use it are using it by the old XMLHttpRequest() object. Do you know jQuery makes it really easy to make a Ajax request. Here we will first make a jQuery Ajax post request and display the response from the Php page.
Ok here are few simple steps to do it:-

Step 1:- Add jQuery library to header

(Either download the latest jQuery library and upload it or use Google jQuery library Api) Here i will use the jQuery library hosted on Google.

1
2
3

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
</head>

Step 2:- Make a jQuery Ajax post request

After adding the jQuery library you can use all the jQuery functions.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
url='test.php';
data=new Object();
data['data1']="this is data1";
data['data2']="this is data2";
$.ajax({
  type: 'POST', // type of request either Get or Post
  url: url, // Url of the page where to post data and receive response 
  data: data, // data to be post
  success: function(data){ alert(data); } //function to be called on successful reply from server
});
</script>
</head>

Step 3:- Server page

Here we will write code for our test.php page where we will read the posted data, process it and reply according to the data. But as we are only testing here, so we will just print all the posted data as the reply.
here is the code:-

1
2
3

<?php
     print_r($_POST);
?>
Categories: Java Script, PHP