Introduction :
Today we can see many website contact form page which will not reload after submitting the details , It just show the "Success" Message . This is happening because many of the webmasters where creating the contact form using Jquery Ajax and Php . Through this article you are going to learn about loading a data from a php page using ajax and jquery .
Learn How to Load a Data From Php Using Ajax & Jquery :
It is very easy to load a data from php using ajax and jquery , For loading the data you need a web server for running the php page , Because php is a server side language . If you have a web server then continue reading this article .
Download & Demo :
I created a demo which show IP address of any website when entering the domain to a text-box , The IP address will show on a html page without reloading the page , I used Ajax and Jquery for loading the data from Php page on the html page .
I already developed a demo for this tutorial , The demo will make you easy learn this tutorial . For downloading the script : Click here to download , Also you can watch the demo from here : Demo here
Example Of Loading Data From a Php Page Using Ajax & Jquery :
- First of all you need to create a page name "ajax.php" and copy paste the following code to it .
<?php
if ($_GET['ip']):
$ip = gethostbyname($_GET['ip']); //This code will call the ip address
echo($ip); // This code will show the ip address
endif;
?>
- Here "$ip = gethostbyname($_GET['ip']);" is used to find the IP address of the website domain and "echo($ip)" is for printing the IP address .
- Now create a Html page with name "index.html" and copy paste the following code to it and open the page with your web browser .
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>IP Address Of a Website</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>
Please enter a domain name
<input type="text" id="searchip">
<div id="resultip"></div>
<script>
$(document).ready(function() {
$('#searchip').change(function(){
$.ajax({
type: "GET",
url: "ajax.php",
data: 'ip=' + $('#searchip').val(),
success: function(msg){
$('#resultip').html(msg);
}
}); // Ajax Call
}); //event handler
}); //document.ready
</script>
</body>
</html>
- Here on the above script "#searchip" will send the domain address details to the php page and "#resultip" will show the IP address of the domain address entered by the user .
- You are done . This is just an example of loading data from php page using ajax and jquery , You can do more like this by practicing .
Suggested Article For Webmaster :
- Jquery Social Media Share Button For Your Website .
- Google New reCaptcha System Installation Tutorial .
- Create Your Own Live Cricket Score Website Using Php .
- Create Your Own Video Streaming Website Like Youtube .
I hope you well enjoyed this article , If you have any doubts or suggestions about this article please let us know by using the comment box given below . Thanks
