How to limit the number of rows in an HTML table

Question

How to limit the number of rows in an HTML table

Navigation

#1 by (1 votes)

1

I'm doing a database listing screen and displaying the results in an HTML table, everything is working, but I would like to limit the number of lines displayed in five to be all on the same screen and the scrolling is done in the same table. Here is the code:

 <table class="table">
                  <thead>
                    <tr>
                      <th>#</th>
                      <th>Nome</th>
                      <th>E_mail</th>
                      <th>Tipo</th>
                      <th>Opções</th>
                  </thead>
                  <tbody>
                   <?php  while($reg=$listar->fetch_array()){
                   echo "<tr>";
                      echo "<td>".$reg['id_usuario']."</td>
                      <td>".$reg['nome_professor']."</td>
                      <td>".$reg['nome_usuario']."</td>
                      <td>".$reg['tipo']."</td>
                      <td>
                      <a class='btn btn-primary'  name='deletar'><i class='fa fa-fw fa-lg fa-times-circle-o text-danger'></i></a>
                      </td>
                      <td><a class='btn btn-primary'><i class='fa fa-edit fa-fw fa-lg'></i></a> </td>";
                    "</tr>";
                     }
                      ?>
                    </tbody>
                </table>

php html

asked by anonymous 08.12.2016 / 16:35

1 answer

How to convert string to FileImageSource (Icon) Xamarin Forms How to close a .bat file with another .bat file

score 1 · Accepted Answer

You do not necessarily have to worry about the number of rows, but about the maximum size your table can have. It is possible to set a maximum size for the table body and if this limit is exceeded add a scroll bar, I made a quick example here, see if it meets your need:

<html>
<head>
    <style type="text/css">
        table, td, th {
            border: solid 1px;
            border-collapse: collapse;
        }
        thead, tbody {
            display: block;
            width: 130px;
        }
        tbody {
            height: 200px;
            overflow-y: auto;
        }
    </style>
</head>
<body>
    <table>
        <thead>
            <tr>
                <th>Coluna 1</th>
                <th>Coluna 2</th>                
            </tr>
        </thead>
        <?php for ($i = 0; $i < 30; $i++): ?>
            <tr>
                <td>Valor 1</td>
                <td>Valor 2</td>
            </tr>
        <?php endfor; ?>
    </table>
</body>
</html>