AJAX can be used for interactive communication with a database.

The following example will demonstrate how a web page can fetch information from a database with AJAX:


The database table we use in the example above looks like this:

Using AJAX with Database in PHP

In this example, I will show you how a web page can fetch information from a database by using, selecting user name from user list.

<!DOCTYPE html>
        <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
        <title>AJAX with Database</title>
        <script type="text/javascript">
            function getUserDetails(str) {
                if (str== "") {
                    document.getElementById("userDetails").innerHTML= "";
                if (window.XMLHttpRequest) {
                xmlHttp.onreadystatechange=function () {
                    if (xmlHttp.readyState==4) {
                        document.getElementById("userDetails").innerHTML= xmlHttp.responseText;
                xmlHttp.open("GET", "DatabaseAjax.php?drdnVal="+str, true);
        <p style="background-color: gold; width: 200px">Select User Name :</p>
               <select id ="usrName" onchange="getUserDetails(this.value)" >
                     <option value=""> Select User Name </option>
                    <option value="Arun"> Arun </option>
                    <option value="Amit"> Amit </option>
                    <option value="Vineet"> Vineet</option>
                    <option value="Akki"> Akki</option>
                    <option value="Ray"> Ray</option>
        <div id="userDetails">
            <p> <b> User Details:</b></p> 

Using AJAX with Database in PHP

Now select any user name from user list, when you select any user name then ‘DatabaseAjax.php’ will be called.

‘DatabaseAjax.php’ code:
        // Get dropdown value from url
        $val =$_GET["drdnVal"];
        // create connection with database
        $con = mysql_connect("localhost", "root", "root");
        // Check connection successfully created or no
            // display error message when connection creation failed
            die ("<b>Error : ". mysql_error());
        // select database name
        //select record from table
        $qry = "Select * from tempdatabase.tbltemp where username = '".$val."'";
        // query result
        $qryResult = mysql_query($qry,$con);
        //print table structure
        echo "<table border='1px solid balck'>
            <th> Id </th>
            <th> UserName </th>
            <th> EmailId </th>
            <th> Address </th>
            <th> Mobile No </th>
        // Display data in table column
        while ($rowData = mysql_fetch_array($qryResult))
            echo "<tr>";
            echo "<td>".$rowData['Id']."</td>";
            echo "<td>".$rowData['Username']."</td>";
            echo "<td>".$rowData['EmailId']."</td>";
            echo "<td>".$rowData['Address']."</td>";
            echo "<td>".$rowData['MobileNo']."</td>";
            echo "</tr>";
        // close table tag
        echo "</table>" ;
        // close the connection

Using AJAX with Database in PHP

Select any one user name user list; here I am selecting ‘Arun’

Using AJAX with Database in PHP

Leave Comment