PHP - Retrieve MySQLi Table Using jQuery

In this tutorial we will create a Retrieve MySQLi Table using jQuery. This code will fetch the data in the database server base on the select button.The code use jQuery ajax to fetch MySQLi data without page refreshing and manipulate HTML forms to display the retrieve data in the table. This is a user-friendly kind of program feel free user it in your program.

We will be using jQuery a JavaScript framework that design to simplify HTML DOM tree traversal and manipulation. It can retrieve DOM and manipulate each properties of an element based on different criteria such as id, class, etc.

Creating the Main Function

This code contains the main function of the application. This code will automatically retrieve the array of data in the server when the button is clicked. To make this just copy and write these block of codes below inside the text editor, then save it as shown belowstudent.php

script.jsNote: To make the script works make sure you save this file inside the js directory.

$(document).ready(function(){

$('#student').on('click',function(){

$.ajax({

url:'student.php',

type:'POST',

data:{res:1},

success:function(data){

$('#result').empty();

$('#result').append(data);

}

});

});

$('#teacher').on('click',function(){

$.ajax({

url:'teacher.php',

type:'POST',

data:{res:1},

success:function(data){

$('#result').empty();

$('#result').append(data);

}

});

});

});

There you have it we successfully created Retrieve MySQLi Table using jQuery. I hope that this simple tutorial help you to what you are looking for. For more updates and tutorials just kindly visit this site. Enjoy Coding!