display-table

<html>
<head>

<script src="https://code.jquery.com/jquery-2.2.0.min.js"></script>
<script 
src="https://cdn.datatables.net/1.10.11/js/jquery.dataTables.min.js">
  </script>
  
<link 
  href="https://cdn.datatables.net/1.10.11/css/jquery.dataTables.min.css"  
  type="text/css" rel="stylesheet" />
</head>

<script>
$(document).ready(function() {

    $('#countrytable').DataTable();

} );
</script>

<?php

$dbh = mysqli_connect("127.0.0.1", "world", "world", "world");

if (!$dbh) {
    echo "Error: Unable to connect to MySQL." . PHP_EOL;
    echo "Debugging errno: " . mysqli_connect_errno() . PHP_EOL;
    echo "Debugging error: " . mysqli_connect_error() . PHP_EOL;
    exit;
}

$result = $dbh->query(
'select Name, Population, SurfaceArea
  from country order by Population desc'
);


$rows = $result->fetch_all(MYSQLI_ASSOC);

echo format_html_table($rows, 'countrytable');

function format_html_table ($rows, $tableid) {
  $html = "";  
  $thead = "<table id='$tableid' class='display' cellspacing='0' \	
         >\n<thead>\n<tr>\n";
  $html .= "\n<tbody>\n<tr>\n";
  foreach ($rows as $rownum => $row ) {	
    foreach ($row as $colname => $colvalue) {
	  if ($rownum == 0) {
		  $thead .= sprintf("  <th>%s</th>\n", $colname);
	  }		  
      $html .= sprintf("  <td>%s</td>\n", $colvalue);
    }
    $html .= "</tr>\n"; 	
  }
  $html = $thead ."</tr>\n</thead>". $html;
  $html .= "</tbody>\n</table>";
  return $html;
}
?>