Repeat data from a row in the table via modal

Question

Repeat data from a row in the table via modal

Navigation

#1 by (1 votes)
#2 by (0 votes)

0

I get the site contact form the data and ready them on a backend system.

Currently all of them are displayed online ( nome , assunto , e-mail , telefone , id , ação[excluir] ), I would like to see only the email and name and the rest clicking in the line or email it opens in a Bootstrap modal.

I was able to make it appear for each line, except that it only pulls the data from the first message of bd

Here's a snippet of code:

 <?php 
 $this->load->view('menu');
 ?>  
    <div class="container">
        <h1>Dúvidas? Sugestões? Alguem entrou em contato conosco!</h1>
            <table class="table">
              <thead>
                <tr>
                  <th>ID</th>
                  <th>E-mail</th>
                  <th>NOME</th>
                  <th>ASSUNTO</th>
                  <th>MENSAGEM</th>
                  <th>TELEFONE</th>
                  <th>DATA</th>
                  <th>AÇÃO</th>
                </tr>
              </thead>
              <tbody>
                <?php if($usuarios){foreach ($usuarios as $usuario) { ?> 
                <tr>
                  <th scope="row"><?php echo $usuario["id"]; ?></th>
                  <th><a href="#myModal"  data-toggle="modal" data-target="#myModal"><?php echo $usuario["email"]; ?></a></th>
                       <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">Modal title</h4>
                            </div>
                            <div class="modal-body">
                                  <p> <?php echo $usuario["nome"]; ?></p>
                                <p><?php echo $usuario["assunto"]; ?></p>
                                <p><?php echo $usuario["mensagem"]; ?></p>
                                <p><?php echo $usuario["tel"]; ?></p>
                                <p><?php echo $usuario["data"]; ?></p>
                                <p><a class="btn btn-danger" href="<?php echo base_url('mensagem/deletar/'. $usuario["id"]); ?>" onclick="return confirm('Deseja deletar esta mensagem?');"> <i class="glyphicon glyphicon-trash"></i>
                                    </a></p>
                            </div>
                            <div class="modal-footer">
                              <button type="button" class="btn btn-default" data-dismiss="modal">Fechar</button>
                              <button type="button" class="btn btn-primary">Save changes</button>
                            </div>
                          </div>
                        </div>
                      </div>


                </tr>


                <?php  } // end foreach
                  } else {
                ?>

                <tr>
                  <td colspan="3" class="text-center">Não há mensagens pendentes.</td>
                </tr>


                 <?php
                  } // end if
                ?>

              </tbody>
            </table>

           <p>Estas mensagens são relacionadas ao formulário de <a href="http://www.softlove.com.br/index.php/formulario/contato"> contato </a> do site.</p>
    </div>



<?php 
$this->load->view('script');
?>

<script type="text/javascript">
  $('#myModal').on('shown.bs.modal', function () {
  $('#myInput').focus()
})
</script>

php twitter-bootstrap codeigniter

asked by anonymous 09.01.2017 / 14:22

2 answers

0

I got this way using the Framework Materialize css

If anyone needs it !!! :)

Follow the code:

                <?php foreach ($listagem as $list): ?>
            <!--Corpo da Tabela-->
            <tbody>
                <tr>
                    <td><?= $list['nome'] ?></td>
                    <td><?= $list['sobrenome'] ?></td>
                    <td><?= $list['sexo'] ?></td>
                    <td><?= $list['email'] ?></td>
                    <td><?= $list['fone'] ?></td>
                    <td><?= $list['msg'] ?></td>
                            <td>
                        <input type="hidden" value="<?= $list['id'] ?>">
                        <a href="#modal_edit?<?= $list['id'] ?>" class="btn waves-effect waves-light btn-medium blue modal-trigger" title="Editar">
                                                    <i class="material-icons large">edit</i></a>
                    </td>

                    <!--Modal_Edit-->
                    <div id="modal_edit?<?= $list['id'] ?>" class="modal">
                        <div class="modal-content">
                            <h4><strong>Editar</strong></h4>
                                                            <!--Form de Edição-->
                            <?php include ('form_edit.php'); ?> 
                        </div>
                        <div class="modal-footer">
                            <a class="btn btn-medium" href="">Fechar</a>
                            <a class="btn btn-medium" href="">Salvar</a>
                        </div>
                    </div>
                    <!-- Fim Modal Edit-->
                                       </tr>
            </tbody>
        <?php endforeach ?>
    </table>
</div>

13.07.2018 / 22:39

Display value from another screen Link generated by javascript does not work

score 1 · Accepted Answer

Very simple: pass a unique ID to data-target (or href ) of modal :

data-target="#myModal<?=$usuario["id"];?>"

And every modal must have the same id:

id="myModal<?=$usuario["id"];?>"

You can also change the contents of modal using JQuery ( see here ), but as its loop already returns the id of each item, it is more interesting to change it and adapt data-target .