0

Eu estou com muitas dificuldades em exibir as informações do banco de dados através de um modal. Eu estou acessando o banco por um foreach, mas o problema é que ele só exibe o modal com o ultimo registro da tabela.

Trecho do código:

 <div class="table-responsive">
              <table class="table table-striped table-sm">
                <thead>
                  <tr>
                    <th>#Id</th>
                    <th>Nome | Paciente</th>
                    <th>Data</th>
                    <th>Exame</th>
                    <th>Médico Solicitante</th>
                    <th>Convênio</th>
                  </tr>
                </thead>

          <?php foreach($dwl->findAll() as $value):?>

                <tbody>
                  <tr>
                    <td><?php echo $value->co_patientid; ?></td>
                    <td><?php echo $value->na_patientname; ?></td>
                    <td><?php echo $value->na_studydate; ?></td>
                    <td><?php echo $value->na_description; ?></td>
                    <td><?php echo $value->na_requestername; ?></td>
                    <td><?php echo $value->na_insuranceplan; ?></td>
            <td>
             <button type="button" class="btn btn-danger">Excluir</button>
             <button type="button" class="btn btn-warning">Editar</button>
             <button type="button" class="btn btn-info" data-toggle="modal" data-target="#ModalView-<?php echo $value->co_patientid; ?>">Visualizar</button>
           </td>
          </tr>
          </tbody>

       <?php endforeach ; ?>

         </table>
            </div>

        <div class="modal fade" id="ModalView-<?php echo $value->co_patientid; ?>" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
          <div class="modal-dialog" role="document">
            <div class="modal-content">
              <div class="modal-header">
                <h5 class="modal-title" id="modalWorkView"><td>Informações</td></h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Fechar">
                  <span aria-hidden="true">&times;</span>
                </button>
              </div>
              <div class="modal-body">
                <div class="table-responsive">

                  <p><b>#Id:</b> <?php echo $value->co_patientid; ?> </p>
                  <p><b>Paciente:</b> <?php echo $value->na_patientname; ?> </p>
                  <p><b>Data do Exame:</b> <?php echo $value->na_studydate; ?> </p>
                  <p><b>Descrição Exame:</b> <?php echo $value->na_description; ?> </p>
                  <p><b>Médico Solivitante:</b> <?php echo $value->na_requestername; ?> </p>
                  <p><b>Convênio:</b> <?php echo $value->na_insuranceplan; ?> </p>
                  <p><b><hr></b></p>
                  <p><b>Comentário</p></b>
                  <p><?php echo $value->na_comment; ?> </p>

              </div>
            </div>
          </div>
        </div>


          </main>
        </div>
      </div>

4 Respostas 4

-1

Amigo Taffarel, muito obrigado pela ajuda ! Acho que expressei minha dúvida de forma errada, na verdade esse foreach lista todos os registros da minha tabela pacientes como mostra a imagem abaixo. PRINT 01 Até essa etapa tudo ocorre como esperado porém, ao clicar no botão de visualização daquele paciente ele exibe a Modal mas retorna somente o último registro inserido na tabela, ou seja, ele não abre o modal com o ID correspondente. No print enviado existem 4 pacientes, ao clicar no modal dos 3 primeiros registros(stallone, joana, ana) ele só retona as informações do último registro (sergio).

1
  • Fiz uma edição, veja a minha resposta. 28/09/2019 às 23:35
-1

Usando Jquery

Adicione:

  <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
  <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
  <link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

Substitua esta parte:

<button type="button" class="btn btn-info" data-toggle="modal" data-target="#ModalView-<?php echo $value->co_patientid; ?>">Visualizar</button>

Por:

<button type="button" data-paciente='<?php echo json_encode($value) ?>' class="btn btn-info visualizar">Visualizar</button>

Substitua esta parte:

<div class="modal fade" id="ModalView-<?php echo $value->co_patientid; ?>" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">

Por esta:

<div class="modal fade" id="idModal" tabindex="-1" role="dialog" aria-labelledby="TituloModalCentralizado" aria-hidden="true">

Abaixo, cria um script (javascript), desta forma:

  <script>
   //Quando clicar em visualizar:
    $('.visualizar').click(function() {
      //Os dados
      let data = JSON.parse($(this).attr('data-paciente'));

      //Veja o código no console
      console.log(data);

      //#IdModal: Id do seu modal.
      //Show: abre o modal.
      $('#idModal').modal('show');

      /*O elemento em que você queira mostrar os dados,
      ao clicar no botão de visualizar. 
      Aqui, você poder fazer qualquer coisa:*/
      $('#get-data-modal').html(JSON.stringify(data));
    })
  </script>
-1

Italo, não sei como estão os seus modais, mas se você não criar um modal na página para cada registro, acredito que essa sua linha de raciocínio não funcionará (e mesmo se tivesse tantos modais, com certeza não seria nem um pouco indicado fazer desse jeito), pois veja bem, se você tiver 50 registros a serem mostrados na página, ela teria que ter 50 modais. oO

Solução Correta: Crie apenas um modal, como por exemplo, "modal-registro" e quando o usuário clicar para visualizar o registro, você chama uma função javascript que insere os dados no modal utilizando ajax e o exibe. Se for usar jQuery fica bem fácil de fazer.

Vamos a um passo a passo resumido:

1- Crie uma div com id="registro" dentro do "modal-registro" que irá mostrar os registros

<div class="modal fade" id="modal-registro" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
  <div class="modal-content">
    <div class="modal-header">
      <h5 class="modal-title" id="modalWorkView"><td>Informações</td></h5>
      <button type="button" class="close" data-dismiss="modal" aria-label="Fechar">
        <span aria-hidden="true">&times;</span>
      </button>
    </div>
    <div class="modal-body">
      <div id="registro" class="table-responsive"></div>
    </div>
  </div>
</div>

2- Adicionar o evento onclick no botão de visualizar registro, passando o ID como parametro

<button type="button" class="btn btn-info" onclick="mostrarRegistro(<?=$value->co_patientid?>);">Visualizar</button>

3- Crie a função que receba o id do registro, busque os dados dele utilizando ajax e por fim, adicione a resposta no modal e o mostre.

function mostrarRegistro(id){
  $.post("consultar-registro.php", { 'id':id},
      function (resposta) {
          // Subistitui o conteúdo da div com id="registro"
          $("#registro").html(resposta);
          // Mostra o modal usando jquery
          $('#modal-registro').modal('show');
      }
  );
}

4- Agora é só criar a página em php com a consulta pelo id do registro, algo do tipo:

// Recebe o id via post
$id = (isset($_POST['id'])) ? $_POST['id'] : null;
...
...
// Consulta os dados do id recebido no banco de dados
$sql - SELECT * FROM...
...
...
// Imprime o resultado para que o jquery insira no modal e o exiba
echo"
   <p><b>#Id:</b>".$value->co_patientid."</p>
   ...
   ...
   ...
   ...
   <p><b>Comentário</p></b>
   <p>".$value->na_comment."</p>
";

Enfim, esse é um exemplo básico e simples para mostrar como fazer, basta você adaptar ao seu propósito, eu não cheguei a testar, as vezes pode ter alguma divergencia em relação a nomes e erros de digitação, então, atenha-se a lógica. Espero que tenha ajudado.

Edição:

As vezes assim funcione, porem vira uma gambiarra danada que vai pesar sua página e te trazer dores de cabeça no futuro, somente a titulo de curiosidade e para fins didáticos...

Adicionado o modal para dentro do foreach, assim ele criará um modal para cada registro, o que não é nada aconselhável, principalmente se tiver muitas requisições para essa página...

<div class="table-responsive">
  <table class="table table-striped table-sm">
    <thead>
      <tr>
        <th>#Id</th>
        <th>Nome | Paciente</th>
        <th>Data</th>
        <th>Exame</th>
        <th>Médico Solicitante</th>
        <th>Convênio</th>
      </tr>
    </thead>

    <?php foreach($dwl->findAll() as $value):?>

    <tbody>
      <tr>
        <td><?=$value->co_patientid;?></td>
        <td><?=$value->na_patientname;?></td>
        <td><?=$value->na_studydate;?></td>
        <td><?=$value->na_description;?></td>
        <td><?=$value->na_requestername;?></td>
        <td><?=$value->na_insuranceplan;?></td>
        <td>
          <button type="button" class="btn btn-danger">Excluir</button>
          <button type="button" class="btn btn-warning">Editar</button>
          <button type="button" class="btn btn-info" data-toggle="modal" data-target="#ModalView-<?php echo $value->co_patientid; ?>">Visualizar</button>
       </td>
      </tr>
    </tbody>
    
    
    <div class="modal fade" id="ModalView-<?=$value->co_patientid;?>" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <h5 class="modal-title" id="modalWorkView"><td>Informações</td></h5>
          <button type="button" class="close" data-dismiss="modal" aria-label="Fechar">
            <span aria-hidden="true">&times;</span>
          </button>
        </div>
        <div class="modal-body">
          <div class="table-responsive">

            <p><b>#Id:</b> <?=$value->co_patientid;?> </p>
            <p><b>Paciente:</b> <?=$value->na_patientname;?> </p>
            <p><b>Data do Exame:</b> <?=$value->na_studydate;?> </p>
            <p><b>Descrição Exame:</b> <?=$value->na_description;?> </p>
            <p><b>Médico Solivitante:</b> <?=$value->na_requestername;?> </p>
            <p><b>Convênio:</b> <?=$value->na_insuranceplan;?> </p>
            <p><b><hr></b></p>
            <p><b>Comentário</p></b>
            <p><?=$value->na_comment;?> </p>

        </div>
      </div>
    </div>
  </div>


   <?php endforeach ; ?>

  </table>
</div>


</main>
</div>
</div>

-1

Eu estava com esse mesmo problema e resolvi colocando todo o código PHP (ou seja o foreach) só na que me interessava e ficou assim:

Resolveu o meu problema. espero ter ajudado a resolver o seu.

                <button type="button" class="btn btn-info btn-lg" data-bs-toggle="modal" data-bs-target="#exampleModal1">
                <img src="img/atividades.png" alt="Imagem responsiva" width="50"><strong>ATIVIDADES </strong> 
                </button>

                <!-- Modal -->
        
                <div class="modal fade" id="exampleModal1" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content">
                    <div class="modal-header btn btn-info">
                        <h1 class="modal-title fs-5" id="exampleModalLabel">Atividades</h1>
                        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
                    </div>
                    <div class="modal-body">
                        <label>Conteúdo:</label>
                        <!-- Impressao dos valores do banco -->
                        <?php foreach(ordem_servico_atividades($_SESSION['login']['cod_funcionario_pk']) as $row){ 
                            print "<br>".$row['conteudo'];
                    
                        }?>
                        <!-- FIM da impressao dos valores do banco -->
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-info" data-bs-dismiss="modal">Fechar</button>
                    </div>
                    </div>
                </div>
                </div>

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .