php – Using Jquery Ajax to retrieve data from Mysql

php – Using Jquery Ajax to retrieve data from Mysql

For retrieving data using Ajax + jQuery, you should write the following code:

 <html>
 <script type=text/javascript src=jquery-1.3.2.js> </script>

 <script type=text/javascript>

 $(document).ready(function() {

    $(#display).click(function() {                

      $.ajax({    //create an ajax request to display.php
        type: GET,
        url: display.php,             
        dataType: html,   //expect html to be returned                
        success: function(response){                    
            $(#responsecontainer).html(response); 
            //alert(response);
        }

    });
});
});

</script>

<body>
<h3 align=center>Manage Student Details</h3>
<table border=1 align=center>
   <tr>
       <td> <input type=button id=display value=Display All Data /> </td>
   </tr>
</table>
<div id=responsecontainer align=center>

</div>
</body>
</html>

For mysqli connection, write this:

<?php 
$con=mysqli_connect(localhost,root,); 

For displaying the data from database, you should write this :

<?php
include(connection.php);
mysqli_select_db(samples,$con);
$result=mysqli_query(select * from student,$con);

echo <table border=1 >
<tr>
<td align=center> <b>Roll No</b></td>
<td align=center><b>Name</b></td>
<td align=center><b>Address</b></td>
<td align=center><b>Stream</b></td></td>
<td align=center><b>Status</b></td>;

while($data = mysqli_fetch_row($result))
{   
    echo <tr>;
    echo <td align=center>$data[0]</td>;
    echo <td align=center>$data[1]</td>;
    echo <td align=center>$data[2]</td>;
    echo <td align=center>$data[3]</td>;
    echo <td align=center>$data[4]</td>;
    echo </tr>;
}
echo </table>;
?>

You cant return ajax return value. You stored global variable store your return values after return.
Or Change ur code like this one.

AjaxGet = function (url) {
    var result = $.ajax({
        type: POST,
        url: url,
       param: {},
        contentType: application/json; charset=utf-8,
        dataType: json,
       async: false,
        success: function (data) {
            // nothing needed here
      }
    }) .responseText ;
    return  result;
}

php – Using Jquery Ajax to retrieve data from Mysql

Please make sure your $row[1] , $row[2] contains correct value, we do assume here that 1 = Name , and 2 here is your Address field ?

Assuming you have correctly fetched your records from your Records.php, You can do something like this:

$(document).ready(function()
{
    $(#getRecords).click(function()
    {
        var response = ;
        $.ajax({ type: POST,   
                 url: Records.php,   
                 async: false,
                 success : function(text){
                               $(#table1).html(text);
                           }
           });
    });

}

In your HTML

<table id=table1> 
    //Let jQuery AJAX Change This Text  
</table>
<button id=getRecords>Get Records</button>

A little note:

Try learing PDO http://php.net/manual/en/class.pdo.php since mysql_* functions are no longer encouraged..

Leave a Reply

Your email address will not be published.