View Mysql inside modal

Question

I am developing a new PHP ordering system that works as follows:

• The user does upload requests, which are stored in a Mysql table called requests;
• After uploading, the user can change the status of those imported applications by script in PHP that do the table update requests;
• Each change is saved through a Trigger in a table called logs;
• Orders have a unique and unique number that does not repeat.

I could create a link in the order number, for example, that invokes a modal, and within this modal display the changes that are in the table logs only that order number clicked?

display of Mysql data on the page:

    $result = mysqli_query($connect, "SELECT * FROM `pedidos`");

    echo "<div style='height: 70%;'><table border='1' id='pedidos' class='table table-responsive'>
    <tr>
    <th><input type='checkbox' name='select-all' id='select-all' /></th>
    <th>Data de emissão</th>
    <th>EMS</th>
    <th>Pedido do  cliente</th>
    <th>Cliente</th>
    <th>Valor do pedido</th>
    <th>Status</th>
    <th>Nota Fiscal</th>
    </tr>";

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

    echo "</ul>";
      echo "<tr>";
      echo "<td><input name='checkbox[]' type='checkbox' value=" . $row['id'] . "></td>";
      echo "<td>" . $row['emissaoPed'] . "</td>";
      echo "<td><a data-toggle='modal' href='#myModal'>" . $row['nPedido'] . "</a></td>";
      echo "<td>" . $row['NrPedido'] . "</td>";
      echo "<td>" . $row['nomeAbrev'] . "</td>";
      echo "<td>" . $row['vlr'] . "</td>";
      echo "<td>" . $row['status'] . "</td>";
      echo "</tr>";
    }
    echo "</table>";
    echo "</form></div>";

I made the following query to bring the request by order number:

$result = mysqli_query($connect, "SELECT * FROM `logs` where nPedido IN (34366)");

However, I do not know how to replace the order number as defined in query by the order number clicked.

Answer 1

It is possible and it is simple. For this you will use the function $.ajax() jQuery.

1 - create a list of products from the database and link the ID of each product in a link, something like:

    $result = mysqli_query($connect, "SELECT * FROM `pedidos`");

        echo "<div style='height: 70%;'><table border='1' id='pedidos' class='table table-responsive'>
        <tr>
        <th><input type='checkbox' name='select-all' id='select-all' /></th>
        <th>Data de emissão</th>
        <th>EMS</th>
        <th>Pedido do  cliente</th>
        <th>Cliente</th>
        <th>Valor do pedido</th>
        <th>Status</th>
        <th>Nota Fiscal</th>
        </tr>";

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

        echo "</ul>";
          echo "<tr>";
          echo "<td><input name='checkbox[]' type='checkbox' value=" . $row['id'] . "></td>";
          echo "<td>" . $row['emissaoPed'] . "</td>";
          echo "<td><a id='ver_pedido' data-ref=".$row['nPedido']." href='javascript:void(0)'>" . $row['nPedido'] . "</a></td>";
          echo "<td>" . $row['NrPedido'] . "</td>";
          echo "<td>" . $row['nomeAbrev'] . "</td>";
          echo "<td>" . $row['vlr'] . "</td>";
          echo "<td>" . $row['status'] . "</td>";
          echo "</tr>";
        }
        echo "</table>";
        echo "</form></div>";

2 - Get the link ID clicked:

jQuery

$('a#ver_pedido').click(function(){

    let id_pedido = $(this).attr('data-ref');

    $.ajax({
        url: 'pagina_detalhada.php',
        data: {id: id_pedido},
        type: 'POST',

        success: function(response){

            $('#div_dentro_modal').empty();
            $('#div_dentro_modal').html(response);
            $('#abremodal').click();
        }
    });
});

3 - Create a link with the settings to open the modal (you can put this link anywhere in HTML except in PHP loops):

<a data-toggle='modal' id="abremodal" href='#myModal'></a>

4 - Inside your modal, create a div and put the same ID you put in the function success jQuery, in my case:

<div id="div_dentro_modal"></div>

5 - Create the page you passed in the parameter url of $.ajax() and in it, take the clicked request ID and mount an HTML to display in modal, something like:

php.

<?php
$id_pedido = $_POST['id'];
$result = mysqli_query($connect, "SELECT * FROM `logs` where nPedido IN ('".$id_pedido."')");

//.... Restante do código, após obter o resultado de um "echo" para enviar ao modal

NOTE: don’t forget step 4, it is very important to display the information in modal