Wallpapers Forums Login

Easy Simple Tutorial How To Use Ajax Jquery With Php

Posted On Sun Jan 29, 2012 By webune In Wallpaper Scripts Forums And Topics About Programming Forums

hello everyone, im sort of new to jquery and ajax. i was getting familiar with using javascript and ajax when all of the sudden i started to do things and all directions pointed towards using jquery. so i had to learn jquery.. it was the best thing i did. its so much easy. this is a very simple way to show content from a php file using ajax

so with that in mind, i am going to show you a simple script which you can use to practice and see how it works.

im a PHP programmer so i will be performing the server side script using PHP.

i am using a Windows 7 Computer so i will be using notepad to create the files.

the first file we are going to create is the HTML file, you can call it jquery-simple-ajax.php or jquery-simple-ajax.html whatever you want. i am going to call it jquery-simple-ajax.php

so open a new notepad, copy and paste this code and save it as jquery-simple-ajax.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Simple JQuery Ajax Example by Webune.com</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
// This functions starts the ajax to show the output from post.php
// COPYRIGHT: WWW.WEBUNE.COM 
function StartAjax(ResultsId){
	$.ajax({
	  type: "GET",
	  url: "post.php",
	  cache: false,
	  data: "name=John&location=Boston",
	  success: function(html){
		$("#"+ResultsId).append(html);
	  }
	
	});
}
</script>
</head>
<body>
<a href="#" onclick="StartAjax('ResultsId');">Click Here to see content from post.php</a>
<div id="ResultsId"></div>
</body>
</html>

next we are going to create the server side file called post.php

open another notepad, copy and paste the following code and save it as post.php

<?php 
# The followin code will be sent to the ResultsId div in the jquery-simple-ajax.php file
# COPYRIGHT: WWW.WEBUNE.COM
echo 'This is the Data Received:<br><PRE>';print_r($_REQUEST);echo '</PRE>';
?>

Chris Sun May 13, 2012

A very clear and concise example; thank you.

steve Sat Apr 21, 2012

change the src url to:

http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js

ketan Fri Apr 20, 2012

this code is not work in localhost why pls reply

chandra Wed Nov 21, 2012

nice & very easy example very very thank you.

helle Fri Nov 23, 2012

YES - I finally got an ajax-example to work thanks to you :)

Information

Forums »
Wallpaper Scripts Forums And Topics About Programming »
Easy Simple Tutorial How To Use Ajax Jquery With Php

Title: Easy Simple Tutorial How To Use Ajax Jquery With Php

Description: this tutorial will show you how you can use jquery to get ajax from a server side script using simple html and php code

Tags: php ,computer ,programming ,script ,javascript ,jquery

Info: This Post Has Been Viewed 0 Times Since
Date: Sun Jan 29, 2012
Author webune Received 5 Replies #1361

Programming With Linux Shell Tutorial By Example Passing Arguments To A Script

Easy Simple Tutorial How To Use Ajax Jquery With Php

Related Content

Information

Share