Sent POST text "<td>" via AJAX

Question

Good afternoon, I have this code:

            <?php foreach ($resultado as $row) { ?>

                <tr>
                    <td class="seis"><?php echo $row['seis']; ?></td>
                    <td class="ban"><?php echo $row['ban']; ?></td>
                    <td name="bon"><?php echo $row['bon']; ?></td>
                    <td name="qntd"><?php echo $row['quantidade']; ?></td>
                    <td name="pre"><?php echo "R$ " . $row['preco']; ?></td>
                    <td name="ven"><?php echo $row['Vendedor']; ?></td>
                    <td class="text-right">
                        <input name="comprar" id="comprar" value="Comprar" class="btn btn-success" type="submit"></input>                   
                    </td>
                </tr>
            <?php } ?>

He makes a table for each column in the comic. I need to send this information (by performing a POST) of what is among the <td>. I tried with this code:

     <script>
   $(document).ready(function () {
     // No click do botão de submit
     $('#comprar').click(function () {
         // Recebe os dados do formulário
         var valorTd = $('.seis').text();
         // Envia a requisição ajax
         $.ajax({
             url: "ajax/recebe_pedido.php", // Arquivo php que vai receber os dados
             data: { // Recebe os dados das td´s e passa em um json
             valorTd: valorTd,
             },
             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;
    });
});
</script>

But by clicking the button buy, all the <td> are being sent, and it is to send according to the column that I clicked the button buy

Example: valorTd: 498401 498406 547874 547874 547874 547874 547874 547874 547874 547874

Answer 1

Assuming your foreach has a column id, try like this:

<?php foreach ($resultado as $row) { ?>
    <tr>
        <td class="seis_<?=$row['id']?>"><?php echo $row['seis']; ?></td>
        <td class="ban_<?=$row['id']?>"><?php echo $row['ban']; ?></td>
        <td class="bon_<?=$row['id']?>"><?php echo $row['bon']; ?></td>
        <td class="qntd_<?=$row['id']?>"><?php echo $row['quantidade']; ?></td>
        <td class="pre_<?=$row['id']?>"><?php echo "R$ " . $row['preco']; ?></td>
        <td class="ven_<?=$row['id']?>"><?php echo $row['Vendedor']; ?></td>
        <td class="text-right">
            <input name="comprar" id="comprar" value="Comprar" class="comprar btn btn-success" type="submit" coluna="<?=$row['id']?>"></input>                   
        </td>
    </tr>
<?php } ?>

<script>
    $(document).ready(function () {
        // No click do botão de submit
        $('.comprar').click(function () {
            var coluna = $(this).attr('coluna');
            // Recebe os dados do formulário
            var valorTd = $('.seis_'+coluna).text();
            // Envia a requisição ajax
            $.ajax({
                url: "ajax/recebe_pedido.php", // Arquivo php que vai receber os dados
                data: { // Recebe os dados das td´s e passa em um json
                valorTd: valorTd,
            },
            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;
        });
    });
</script>