Carry out consultation with Modal

Asked

Viewed 307 times

1

Hello, good afternoon.

I am creating a registration and consultation system, in the query part, within a table it lists the amount of proposal according to the situation. Propostas

Only that I want that by clicking on this line, it opens in a modal all those proposals and not only quantity. Ex: when clicking on the line of the "Active" Situation, in a modal shows all the 3 situation of the proposals "Active". Modal

The problem I am having is to carry out this consultation in the bank and return in the modal these values, if anyone can help me I really appreciate it. Note: In the second image, company 1,2 and 3 are examples that I manually put in Modal, this information had to be returned from the database.

<?php
require_once("conexao/conexao.php");

$sql = new mysqli('');
$query = $sql->query("SELECT Situacao, COUNT(*) QNT FROM propostas_detalhe GROUP BY Situacao");
?>


<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel" style="text-align:center">Tabelas</h4>
      </div>
      <div class="modal-body">
        <table class="w3-table-all w3-hoverable">
            <tr>
                <td><b>Nome<b/></td>
                <td><b>CNPJ<b/></td>
                <td><b>Situacao da Propostas<b/></td>
            </tr>

            <!-- AS CONSULTAS -->

        </table>
      </div>
    </div>
  </div>
</div>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

<html lang="pt-br">
<head>
    <meta charset="UTF-8"/>
    <title>Aprendendo</title>

    <link rel="stylesheet" type="text/css" href="css/estilo.css"/>
    <link rel="stylesheet" type="text/css" href="css/forma.css"/>
    <link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">

</head>

<body>
<div id="interface">

    <header id="cabecalho">
        <h1>Consultar Situacoes das Propostas</h1>

        <div class="wrapper">
        <nav>
            <ul type="disc">
                <li><a href="index.html">Cadastrar</a></li>
                <li><a href="consultar.php">Consultar</a></li>
                <li><a href="alterar.php">Alterar</a></li>
            </ul>
        </nav>
    </header>
    </br>

    <center><table class="w3-table-all w3-hoverable"></center>
    <tr>
        <td><b>Situacao<b/></td>
        <td><b>Quantidade<b/></td>
    </tr>
        <?php  while($reg = $query->fetch_array()){ ?>
        <tr data-toggle="modal" data-target="#myModal" style="cursor: pointer">
            <td><?php echo $reg["Situacao"]; ?></td>
            <td><?php echo $reg["QNT"]; ?></td>
        </tr>
        <?php } ?>
    </table><br>

</div>
</body>
</html>
php javascript html mysql modal

  • I didn’t understand, exactly your problem, can tar another example a visual example of what you want,

  • Hello, I added images and tried to be clearer on what I’m trying to do.

1 answer

0

Problem solved, if anyone in the future has the same problem I am leaving my solution below.

<script type="text/javascript">
$(document).ready(function(){
    $('.view_data').click(function(){
        var situacao = $(this).attr("id");

        $.ajax({
            url:"select.php",
            method:"post",
            data:{situacao:situacao},
            success:function(data){
                $("#prop-details").html(data); //Local onde os dados vai ser mostrado, modal no caso
                $('#myModal').modal("show");
            }
        });

    });
});
</script>

And the page where the information will be handled and returned (select.php)

<?php
require_once("conexao/conexao.php");

$output = '';
$sql = new mysqli(); // CONEXAO
$query = $sql->query("SELECT * FROM propostas_detalhe WHERE SITUACAO = '".$_POST["situacao"]."'");

$output .='
    <table class="w3-table-all w3-hoverable">
        <tr>
            <td><b>COD<b/></td>
            <td><b>Empresa<b/></td>
            <td><b>Situacao da Propostas<b/></td>
        </tr>';

while($reg = $query->fetch_array()){
    $output .= '
    <tr>
        <td>'.$reg["COD"].'</td>
        <td>'.$reg["NOME"].'</td>
        <td>'.$reg["SITUACAO"].'</td>
    </tr>
    ';
}

$output .= '</table>';

echo $output;

?>

  • I have the same problem, but I could not solve with your code, still not displaying the information in the modal. Can provide the full example ?

Browser other questions tagged php javascript html mysql modal

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