Try this using ajax and php
<?php
$db = new PDO('mysql:host=localhost;dbname=mysql','root','');
$dbs = $db->query( 'SHOW DATABASES' );
?>
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
li:hover{
cursor: pointer;
}
#list{
float: left;
width: 30%;
}
#table{
float: right;
width: 68%;
}
#main{
width: 70%;
margin: 0 auto;
}
table,th,td{
border: 1px solid #000;
}
th{
width: 120px;
background-color: #000;
color: #fff;
text-transform: capitalize;
}
table {
border-collapse: collapse;
}
</style>
</head>
<body>
<div id="main">
<div id="list">
<select id="dbase" onchange="getTables(this.value)">
<option>Select databse</option>
<?php
while( ( $db = $dbs->fetchColumn( 0 ) ) !== false )
{
echo '<option>',$db,'</option>';
}
?>
</select>
<!-- displaying dropdown ************* -->
<option id="bulk" onchange="drop(this.value)"></option>
</div>
<div id="table"></div>
</div>
<script type="text/javascript">
//*************update for displaying dropdown menu *******
function drop(table){
var table = table;
var db = dbase.value;
var data = new XMLHttpRequest();
data.open("POST","list.php");
data.onreadystatechange = function(){
if(data.readyState === 4 && data.status === 200){
document.getElementById('table').innerHTML = data.responseText;
}
}
data.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
data.send('table='+table+'&dbase='+db);
}
//***********end of update **********
function getTables(table){
var data = new XMLHttpRequest();
data.open("POST","get_tables.php");
data.onreadystatechange = function(){
if(data.readyState === 4 && data.status === 200){
document.getElementById('bulk').innerHTML = data.responseText;
}
}
data.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
data.send('table='+table);
}
</script>
</body>
</html>
create get_tables.php
<?php
$dbname = $_POST['table'];
$db = new PDO("mysql:host=localhost;dbname=$dbname","root","");
$query = $db->prepare('show tables');
$query->execute();
$tabe_in = 'Tables_in_'.$dbname;
$results = $query->fetch(PDO::FETCH_ASSOC);
while ($results != null) {
// change <li> to <option> here **********
echo '<option>',$results[$tabe_in],'</option>';
$results = $query->fetch(PDO::FETCH_ASSOC);
}
?>
and res.php
<?php
$table = $_POST['table'];
$dbname = $_POST['dbase'];
$sql = "SHOW COLUMNS FROM $table";
$db = new PDO("mysql:host=localhost;dbname=$dbname","root","");
$table_headers = array();
$results = $db->prepare($sql);
$results->execute();
$res = $results->fetch();
?>
<table>
<tr>
<?php
while ($res != null) {
echo '<th>',$res['Field'],'</th>';
$table_headers[] = $res['Field'];
$res = $results->fetch();
}
?>
</tr>
<?php
$query = $db->prepare("SELECT * FROM $table");
$query->execute();
$rs = $query->fetchAll();
foreach ($rs as $value) {
echo '<tr>';
foreach ($table_headers as $val) {
echo '<td>',$value[$val],'</td>';
}
echo '</tr>';
}
?>
