1
I am beginner in some areas of programming.
Recently I was told to use Datatable, I did some testing using Html
neat and read a few things about. Tests done with HTML
were very cool I saw the features, I really liked how it works. However, when I tried to use along with the PHP
, more specifically in a search with MYSQL database, the result turned out to be quite different than expected and the main functionalities ended up not working in the same way as in HTML.
This occurs because the Datatable does not work together with Php, MYSQL database, or pq have to do in a different way?
Some of the features I mentioned are:
- Break page on screen and be able to pass the same ( the main in case )
- When pressing the column make the filter in alphabetical order
- field research... and etc.
follows the code I’m using.
<script type="text/javascript">
$(document).ready(function() {
var table = $('#example').DataTable();
new $.fn.dataTable.FixedHeader( table, {
alwaysCloneTop: true
});
} );
</script>
body { font-size: 140%; padding: 1em; }
div.FixedHeader_Cloned table { margin: 0 !important }
<html>
<head>
<title>Prologue by HTML5 UP</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<link rel="stylesheet" href="assets/css/main3.css" />
<!-- Scripts -->
<script type="text/javascript" language="javascript" src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script type="text/javascript" language="javascript" src="dataTables.bootstrap.js"></script>
<script type="text/javascript" language="javascript" src="//cdn.datatables.net/1.10.3/js/jquery.dataTables.min.js"></script>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.scrolly.min.js"></script>
<script src="assets/js/jquery.scrollex.min.js"></script>
<script src="assets/js/browser.min.js"></script>
<script src="assets/js/breakpoints.min.js"></script>
<script src="assets/js/util.js"></script>
<script src="assets/js/main.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.maskedinput/1.4.1/jquery.maskedinput.min.js"></script>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.19/css/jquery.dataTables.css">
<script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.19/js/jquery.dataTables.js"></script>
<table id="example" class="table table-striped table-bordered" cellspacing="0" width="100%">
<thead>
<tr>
<th>Nome</th>
<th>CPF</th>
<th>Data de Nascimento</th>
<th colspan="3">Ações</th>
</tr>
</thead>
<?php
include_once "conexao.php";
$sql = "SELECT * FROM usuario WHERE tipo_perfil LIKE '%CLIENTE%'";
$result = mysqli_query($con,$sql);
if($result){
while($linha = mysqli_fetch_array($result)){
?>
<tbody>
<tr>
<td> <?php echo $linha['nome_usuario'];?></td>
<td> <?php echo $linha['cpf_usuario'];?></td>
<td> <?php echo $linha['data_nascimento'];?></td>
<td><div class="botaodiv"> <?php echo "<a href = ?editar=".$linha['id_usuario']." >+ Informações</a>";?></div></td>
<td><div class="botaodiv"> <?php echo "<a href = ?deletar=".$linha['id_usuario'].">Editar</a>";?></div></td>
<td><div class="botaodiv"> <?php echo "<a href = ?deletar=".$linha['id_usuario'].">Excluir</a>";?></div></td>
</tr>
</tbody>
<?php
}
}
?>
</table>
In the informed case, I prefer to use Datatable in these circumstances with an ajax function and pull all the content that should be shown through json and doing the "build" of php’s DIRECT table on the page... It’s a more effective, fast, and simple way to do it... You could end up reading and seeing some examples of my tip on their website: https://datatables.net/examples/ajax/custom_data_property.html
– Rapha Leão
Thanks for the tip, but I could do without using an ajax function ?. I have not used ajax in any of my codes and so it is very difficult for me to adapt to my code at the moment.
– Leonardo012