How to list Rows <table> values

Question

How can I list column values in a "<table>" ?

I want to list all Rows values in <tr> as shown in the image

Table code:

<table id="datatable" class="table table-striped table-bordered" cellspacing="0" width="100%">
                  <thead>
                    <tr>
                      <th>BANDEIRA</th>
                      <th>TIPO</th>
                      <th>BIN</th>
                      <th>QUANTIDADE</th>
                      <th>VENDEDOR</th>
                      <th class="disabled-sorting text-right">Ações</th>
                    </tr>
                  </thead>
                  <tfoot>
                    <tr>
                       <th>BANDEIRA</th>
                      <th>TIPO</th>
                      <th>BIN</th>
                      <th>QUANTIDADE</th>
                      <th>VENDEDOR</th>
                      <th class="disabled-sorting text-right">Ações</th>
                    </tr>
                  </tfoot>
                  <tbody>
                    <tr>
                      <td>ROW BANDEIRA</td>
                      <td>ROW TIPO</td>
                      <td>ROW BIN</td>
                      <td>ROW QUANTIDADE</td>
                      <td> ROW VENDEDOR</td>
                      <td class="text-right">
                        <a href="#" class="btn btn-info btn-link btn-icon btn-sm like"><i class="fa fa-heart"></i></a>
                        <a href="#" class="btn btn-warning btn-link btn-icon btn-sm edit"><i class="fa fa-edit"></i></a>
                        <a href="#" class="btn btn-danger btn-link btn-icon btn-sm remove"><i class="fa fa-times"></i></a>
                      </td>
                    </tr>

                  </tbody>
                </table>
              </div>

EDIT 2: I need to create a form that makes a POST on the own page with all the values of <td>. I tried this way, but I couldn’t:

 <form method="POST">       
        <tbody>
        <?php foreach ($resultado as $row) { ?>
            <tr>
               <td><?php echo $row['a']; ?></td>
                <td><?php echo $row['b']; ?></td>
                <td><?php echo $row['c']; ?></td>
                <td><?php echo $row['d']; ?></td>
                <td><?php echo "R$ " . $row['e']; ?></td>
                <td><?php echo $row['v']; ?></td>
                <td class="text-right">
                    <input type="submit" value="Info"></input>
                </td>
            </tr>
        <?php } ?>
        </form>

Example: Clicking on the INFO button will make a POST with the value of Row A, Row B and all other Rows

Answer 1

1. How can I list column values in a <table>?

Assuming as a basis that you already have a database connection by PHP you could list values from a table in a very simple way.

To begin we can receive the data from the bank, it is on the basis of them that our table will be generated dynamically.

    $resultado = array(); // Cria um array para receber o resultado
    $query = "SELECT * FROM <nome_da_sua_tabela_aqui>"; // Expressão SQL que irá ser executada
    $result = mysqli_query($this->connection, $query); // Executa a consulta com base na query
    $resultado = $result->fetch_all(MYSQLI_ASSOC); // Faz uma associação

Having the result/data we will show them in the table.

<table id="datatable" class="table table-striped table-bordered" cellspacing="0" width="100%">
    <thead>
    <tr>
        <th>Name</th>
        <th>Position</th>
        <th>Office</th>
        <th>Age</th>
        <th class="disabled-sorting text-right">Actions</th>
    </tr>
    </thead>
    <tfoot>
    <tr>
        <th>BANDEIRA</th>
        <th>TIPO</th>
        <th>BIN</th>
        <th>QUANTIDADE</th>
        <th>VENDEDOR</th>
        <th class="disabled-sorting text-right">Ações</th>
    </tr>
    </tfoot>
    <tbody>
    <?php foreach ($resultado as $row) { ?>
        <tr>
            <td><?php echo $row['nome_da_coluna_que_quer_mostrar_aqui']; ?></td>
            <td><?php echo $row['nome_da_coluna_que_quer_mostrar_aqui']; ?></td>
            <td><?php echo $row['nome_da_coluna_que_quer_mostrar_aqui']; ?></td>
            <td><?php echo $row['nome_da_coluna_que_quer_mostrar_aqui']; ?></td>
            <td class="text-right">
                <a href="#" class="btn btn-info btn-link btn-icon btn-sm like"><i class="fa fa-heart"></i></a>
                <a href="#" class="btn btn-warning btn-link btn-icon btn-sm edit"><i class="fa fa-edit"></i></a>
                <a href="#" class="btn btn-danger btn-link btn-icon btn-sm remove"><i class="fa fa-times"></i></a>
            </td>
        </tr>
    <?php } ?>
</table>

Within the table we will have several lines, or rather several tr. In the first step we received the data from the database, and from them we will show the data in the tables based on the foreach, which provides an easy way to iterate over arrays.

For each iteration, the value of the current element is assigned to $Row and the array internal pointer advances one position (then in next iteration, whether you are looking at the next element, or database line).

More information on the foreach here.

Here on this tutorial you have a complete guide, in case you haven’t even made the connection to the bank with PHP.

2. I need to create a form that makes a POST on the page itself with all the values of <td>

For this you have two options, that I know. One is the most recommended and another would be a gambiarra, that would not recommend.

First you can generate several inputs of type Hidden that would store these table values, or better, the table rows.

The second option is to use AJAX, and then I’ll use jQuery here to facilitate.

You could take the Submit button click event and receive the data from td. It would look something like this.

 $(document).ready(function () {
     // No click do botão de submit
     $('#btn_submit').click(function () {
         // Recebe os dados do formulário
         var valorTd = $('.class_da_td').text();
         var valorTd2 = $('.class_da_td2').text();
         // Envia a requisição ajax
         $.ajax({
             url: "ajax/form.php", // Arquivo php que vai receber os dados
             data: { // Recebe os dados das td´s e passa em um json
             valorTd: valorTd,
             valorTd2: valorTd2,
             },
             global: false,
             type: "POST",
             contentType: "application/x-www-form-urlencoded;charset=utf-8",
             dataType: "html",
             success: function (data) { // se tudo der certo mostra essa mensagem
                alert('Requisição realizada com sucesso!');
          },
        }).responseText;
    });
});

In the archive form.php you would have more or less this structure:

<?php
    echo $_REQUEST['valortd'];
    echo $_REQUEST['valortd2'];
    // A partir disso podemos fazer o que for necessário com esses dados
    // Desde operações como salvar, apagar, editar, o que seja.
?>

Remembering that this is just a small example. Many things have been abstracted to facilitate understanding.