Creation table with dynamic filter

Asked

Viewed 1,357 times

0

My intention is to create filters to appear all columns initially and to be able to choose the columns that appear through checkbox. Can someone help me do that?

 <div class= "form-group"
     <input type="checkbox" class= "btn btn-default" id="Utilizador" value = "Utilizador">Utilizador
     <input type="checkbox" class= "btn btn-default" id="Ano" value="Ano">Ano
 </div>
<br>



    

<?php
         include('conetar.php');


         //------Lançamento de tabela-------//
       
      
        $result = mysqli_query($conn,"SELECT equipamentos.IDEquipamento, equipamentos.Modelo, equipamentos.Ano, equipamentos.Estado, utilizadores.Nome, utilizadores.IDUtilizador FROM `equipamentos` left join utilizadores on equipamentos.IDUtilizador = utilizadores.IDUtilizador");
       

                    echo "<table width='100% class='table table-striped table-bordered table-hover'id='datatables-example'>
                        <tr>
                    </tr>
                        <tr>
                           <td class='pure-table'><b>ID</b></td>
                            <td class='pure-table'><b>Modelo</b></td>
                            <td class='pure-table'><b>Ano</b></td>
                            <td class='pure-table'><b>Utilizador</b></td>
                            <td class='pure-table'><b>Estado</b></td>
                            <td class='pure-table'><b>Editar</b></td>
                            <td class='pure-table'><b>Histórico</b></td>
                            <td class='pure-table'><b>Apagar</b></td>
                        </tr>";

        while($row = mysqli_fetch_array($result)) 
        {

                    echo "<tbody data-link='row' class='rowlink'>";
                    echo "<tr>";
                    echo "<td>" . $row['IDEquipamento'] . "</td>";
                    echo "<td>" . $row['Modelo'] . "</td>";
                    echo "<td>" . $row['Ano'] . "</td>";
                    echo "<td>" . $row['Nome'] . "</td>";
                    echo "<td>" . $row['Estado'] . "</td>";
                    echo "<td><a href='formsEquipmentsUpdate.php?IDEquipamento=".$row['IDEquipamento']."&IDUtilizador=".$row['IDUtilizador']."'>Update</a></td>";
                    echo "<td><a href='tablesHistoryMachine.php?IDEquipamento=".$row['IDEquipamento']. "&IDUtilizador=".$row['IDUtilizador']."'>Histórico</a></td>";
                    echo "<td><a href='deleteEquipment.php?IDEquipamento=".$row['IDEquipamento']."'>Delete</a></td>";
                    echo "</tr>";
                    echo "</tbody>";    
                    }
                    echo "</table>";
                    mysqli_close($conn);


?>



I want only the Users column or the Year column to appear in the table or both.

1 answer

2

Some doubts:

1)must update when clicking the checkbox?

2)should make asynchronous query when clicking the checkbox? (using ajax)

IF YOU WANT SOMETHING VIA AJAX:

1) use Jquery to click on the checkbox it send ajax:

$(function(){
    $("#Utilizador,#Ano").click(function() {
       $.ajax({
          url: "ajax_atualiza_tabela.php",
          type: "GET",
          data:'utilizador='+$('#Utilizador').val()+'&ano='+$("#Ano").val(),
          beforeSend: function(){
          },
          complete: function(){
          },
          success: function(result){
          $("#tabela").html(result);
       }
    });
});

});

ajax_up_table.php:

<?php
         include('conetar.php');
         /* VERIFICANDO CHECKBOXES */
         $colunaUtilizador = $_GET['utilizador'];
         $colunaAno = $_GET['ano'];

         $sql = "SELECT equipamentos.IDEquipamento, equipamentos.Modelo, equipamentos.Estado, utilizadores.IDUtilizador";

         if($colunaUtilizador) {
            $sql .= ',utilizadores.Nome';
         }
         if($colunaAno) {
            $sql .= ',equipamentos.Ano';
         }
         $sql .= ' FROM `equipamentos` left join utilizadores on equipamentos.IDUtilizador = utilizadores.IDUtilizador';




         //------Lançamento de tabela-------//


        $result = mysqli_query($conn,$sql);


                    echo "<table width='100% class='table table-striped table-bordered table-hover'id='datatables-example'>
                        <tr>
                    </tr>
                        <tr>
                           <td class='pure-table'><b>ID</b></td>
                            <td class='pure-table'><b>Modelo</b></td>";
                            if($colunaAno)                                
                               echo "<td class='pure-table'><b>Ano</b></td>";
                            if($colunaUtilizador)
                               echo "<td class='pure-table'><b>Utilizador</b></td>";

                            echo "<td class='pure-table'><b>Estado</b></td>
                            <td class='pure-table'><b>Editar</b></td>
                            <td class='pure-table'><b>Histórico</b></td>
                            <td class='pure-table'><b>Apagar</b></td>
                        </tr>";
        echo "<tbody data-link='row' class='rowlink'>";
        while($row = mysqli_fetch_array($result)) 
        {

                    echo "<tr>";
                    echo "<td>" . $row['IDEquipamento'] . "</td>";
                    echo "<td>" . $row['Modelo'] . "</td>";
                    if($colunaAno) 
                       echo "<td>" . $row['Ano'] . "</td>";
                    if($colunaUtilizador)                        
                       echo "<td>" . $row['Nome'] . "</td>";
                    echo "<td>" . $row['Estado'] . "</td>";
                    echo "<td><a href='formsEquipmentsUpdate.php?IDEquipamento=".$row['IDEquipamento']."&IDUtilizador=".$row['IDUtilizador']."'>Update</a></td>";
                    echo "<td><a href='tablesHistoryMachine.php?IDEquipamento=".$row['IDEquipamento']. "&IDUtilizador=".$row['IDUtilizador']."'>Histórico</a></td>";
                    echo "<td><a href='deleteEquipment.php?IDEquipamento=".$row['IDEquipamento']."'>Delete</a></td>";
                    echo "</tr>";
        }
        echo "</tbody>";    
        echo "</table>";
        mysqli_close($conn);

?>

INDEX.HTML:

<HTML>
<HEAD>
    <SCRIPT>
       $(function(){
          $("#Utilizador,Ano").click(function() {
          $.ajax({
           url: "ajax_atualiza_tabela.php",
           type: "GET",
           data:'utilizador='+$('#Utilizador').val()+'&ano='+$("#Ano").val(),
           beforeSend: function(){
           },
           complete: function(){
           },
           success: function(result){
              $("#tabela").html(result);
           }
        });
    });
});
    </SCRIPT>
</HEAD>
<BODY>
    <div class= "form-group">
     <input type="checkbox" class= "btn btn-default" id="Utilizador" value = "Utilizador">Utilizador
     <input type="checkbox" class= "btn btn-default" id="Ano" value="Ano">Ano
   </div>
   <div id="tabela">

   </div>
</BODY>
</HTML>

PS. Don’t forget to include jquery in the page header

  • The answer to your questions is yes to both

  • The way you did, it’s not working

  • which error presented?

  • I made a small modifications in the code, while closure was open for example

  • Only does not execute the request by clicking on one of the checkbox

  • In the code php, the concatenation of query It has to be like this: $sql = "SELECT equipments. Model, equipment.Status, users.Useviewer" ; if($columnUtilizer) { $sql .= ',users.Name'; } if($colunaAno) { $sql .= ',equipment.Year'; } $sql .= ' from equipamentos left User on equipment.User = users.User';

  • tidy, and possible error of "nothing happens when clicking", could have been for the reason that js was executed before loading the HTML, then just force it to start after building/ drawing the html, more about https://learn.jquery.com/using-jquery-core/document-ready/

Show 2 more comments

Browser other questions tagged

You are not signed in. Login or sign up in order to post.