View data from a database in modals

Asked

Viewed 81 times

0

I made a table to display 2 database data, and then on each line put an icon so that when clicked there appeared a modal with information from that line of type:

<?
                $sql = mysql_query("SELECT a.n_processo,a.nome,a.data_nasc,a.cc,g.designacao,a.ciclo_formacao,t.texto
                                    FROM alunos a, cursos g, tipo_curso t
                                    WHERE a.n_curso = g.n_curso
                                    AND g.id_tipo_curso = t.id_tipo_curso");
?>
            <!-- ----------------CABEÇALHO---------------------------- -->
        <table class="tabela1">
        <tr>
            <td id="tb1">Nº Processo</font>
            <td id="tb2">Nome</font>
        </table>

    <?
    //---------------DADOS------------------------
            while($row = mysql_fetch_array($sql))
                {

                    echo "<TABLE class='tabela2'>";
                    echo "<TR class='tabela2'>";
                        echo "<TD  style='padding-left:5px;width:20%;'>".$row['n_processo']."</TD>";
                        echo "<TD style='padding-left:15px;width:55%;'>".$row['nome']."</TD>";
                        echo "<TD style='text-align: right; letter-spacing: 5px; padding-right:10px;'>";

                        // --------------------------------------- MOSTRAR ------------------------------------

                        echo"
                        <button class='menubotao' id='ver'>
                            <i class='fa fa-eye' ></i>
                        </button>

                        echo"

                        <button class='menubotao' id='ver'data-toggle='modal' data-target='#myModal2'>
                            <i class='fa fa-eye' ></i>
                        </button> 

                            <div id='myModal2' class='modal fade' role='dialog'>
                              <div class='modal-dialog'>

                                <div class='modal-content' style='letter-spacing:0px; text-align:left;'>
                                  <div class='modal-header' style=' background-color:#0066cc;'>
                                    <button type='button' class='close' data-dismiss='modal'>&times;</button>
                                    <h4 class='modal-title' style='font-size:25px; color:#FFF;'>Dados do Aluno</h4>
                                  </div>
                                  <div class='modal-body' style='font-size:20px;'>
                                    <p><b style='background-color:#0066cc;color:white;padding:2px;border-radius:5px;'>Nº de processo:</b> ".$row['n_processo']."</p>
                                    <br>
                                    <p><b style='background-color:#0066cc;color:white;padding:2px;border-radius:5px;'>Nome:</b> ".$row['nome']."</p>
                                    <br>
                                    <p><b style='background-color:#0066cc;color:white;padding:2px;border-radius:5px;'>Data Nascimento:</b> ".$row['data_nasc']."</p>
                                    <br>
                                    <p><b style='background-color:#0066cc;color:white;padding:2px;border-radius:5px;'>C.C. <small>(Cãrtao de Cidadão)</small>:</b> <font style='text-transform:uppercase;'> ".$row['cc']."</font></p>
                                    <br>
                                    <p><b style='background-color:#0066cc;color:white;padding:2px;border-radius:5px;'>Tipo do Curso: </b> ".$row['texto']."</p>
                                    <br>
                                    <p><b style='background-color:#0066cc;color:white;padding:2px;border-radius:5px;'>Curso: </b> ".$row['designacao']."</p>
                                    <br>
                                    <p><b style='background-color:#0066cc;color:white;padding:2px;border-radius:5px;'>Ciclo de Formação:</b> ".$row['ciclo_formacao']."</p>
                                  </div>
                                  <div class='modal-footer'>
                                    <button type='button' class='btn btn-default' data-dismiss='modal'><i class='fa fa-times fa-2x'></i></button>
                                  </div>
                                </div>

                              </div>
                            </div>
                            ";

When clicked on the button, a modal appears with the respective data. However to create the table the data is presented correctly, but when it is clicked on the button, whatever it, the value will always be the first line. My doubt, is why it happens, being that it is within the while?

2 answers

0

Note that there is a quote that has not been closed in the code

 // --------------------------------------- MOSTRAR ------------------------------------

                    echo"
                    <button class='menubotao' id='ver'>
                        <i class='fa fa-eye' ></i>
                    </button>

                    echo"

Type as follows:

 // --------------------------------------- MOSTRAR ------------------------------------

                    echo"
                    <button class='menubotao' id='ver'>
                        <i class='fa fa-eye' ></i>
                    </button>";

                    echo

0


Why always be the first line, simple yours buttom does not create a reference for each modal. Solution?

Create a variable to iterate to each occurrence of while. In the attribute data-target of your buttom trigger it, and in id modal also.

Example

//---------------DADOS------------------------
$modal = 0; //variavel para iterar
while($row = mysql_fetch_array($sql)) {
   ...
   ...

echo"
    <button class='menubotao' id='ver'data-toggle='modal' data-target='#myModal".$modal;".'>
      <i class='fa fa-eye' ></i>
    </button>

<div id='myModal".$modal."' class='modal fade' role='dialog'>
    <div class='modal-dialog'>
...

$modal++;
";

At the end of while not to forget increase the variable!

  • Thank you Igor! It helped a lot.

  • @2016 You’re welcome, we’re here for this!

Browser other questions tagged

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