load a data from php using ajax and jquery

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 :

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

0 comments:

Post a Comment

Wapmaster or Webmaster can Comment Us with the following Comment Box . Don't add Links to your site for Spamming our Blog .. Once you add Comment with Link . It will be deleted immediatly by our Admins .

 
Top