How to store value in cell and display it with a button

0

I have a table that I fill in from a query to the base. I receive the records that I need through a while and in the last column of the table I place a button. The idea is that when I click on that button I can visualize a modal with the data of the 'COMMENT' field, which during the loop I am saving in the $ comment variable. I get the records correctly, I could make the modal work, but I need to show the information. Copy the code:

<html>
<head>
    <Link href="estilo1.css" rel="stylesheet" type="text/css" />
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>   
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="refresh" content="30" />

<script type="text/javascript">
    function vw_mostrar() {
        document.getElementById('light').style.display='block';
        document.getElementById('fade').style.display='block';
    }

    function vw_nomostrar() {
        document.getElementById('light').style.display='none';
        document.getElementById('fade').style.display='none';
    }
</script>

</head>

<body>

<div id="fade" class="overlay"></div>
  <div id="light" class="modal">
     <p>TEXTO DE EJEMPLO O PRUEBAS JAJDJDJDJDJDJDJD </p>
     <p><input type='button' value='Leído' id='Ver' onclick="javascript:vw_nomostrar();"</p>
  </div>
<p><a href="javascript:vw_mostrar();">Ver</a></p>
</body>

<div id="contiene_tabla">
  <table border="0" cellspacing="0" cellpadding="0">
    <thead>
      <tr>
        <th>Nº SOCIO</th>
        <th>INGRESA</th>
        <th>NOMBRES Y APELLIDO</th>
        <th>CATEGORIA</th>
        <th>PUNTOS</th>
        <th> ? </th>
      </tr>
    </thead>
    <tbody>

<?php

require('controlador.php');

    $consulta1 = socios_alerta($conS,$cadena_nueva);

        while ($fila = oci_fetch_array($consulta1, OCI_ASSOC+OCI_RETURN_NULLS)) {

        $vsocio=trim($fila['NUM_SOCIO']);
        $vfecha=trim($fila['FECHA']);
        $vapellido=trim($fila['APELLIDO']);
        $vnombre=trim($fila['NOMBRE']);
        $vcate=trim($fila['CATEGORIA']);
        $vpuntaje=trim($fila['PUNTOS']);
        $comentario=trim($fila['COMENTA']);

        echo "<tr>\n";
        echo "    <td align='center'>" . $vsocio . "</td>\n";
        echo "    <td align='right'>" . $vfecha . "</td>\n";
        echo "    <td align='left'>"  . $vnombre . ", " . $vapellido . "</td>\n";
        echo "    <td align='center'>" . $vcate . "</td>\n";
        echo "    <td align='right'>" . $vpuntaje ."</td>\n";
        echo "    <td align='center'><input type='button' value='Ver' id='Ver' onclick='javascript:vw_mostrar()';></td>\n";
        echo "</tr>\n";
        
        }
        
        oci_close($conn);

?>
    </tbody>
  </table>
</div>
</body>

</html>

The page is in PHP and I use some html.

    
asked by look68 08.08.2018 в 17:44
source

2 answers

1

Dear, this would be an option:

<html>
<head>
    <Link href="estilo1.css" rel="stylesheet" type="text/css" />
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>   
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="refresh" content="30" />

<script type="text/javascript">
    function vw_mostrar(comentario) {
        document.getElementById('light').style.display='block';
        document.getElementById('fade').style.display='block';
        document.getElementById('comentario').innerHTML = comentario;
    }

    function vw_nomostrar() {
        document.getElementById('light').style.display='none';
        document.getElementById('fade').style.display='none';
    }
</script>

</head>

<body>

<div id="fade" class="overlay"></div>
  <div id="light" class="modal">
     <p id="comentario">TEXTO DE EJEMPLO O PRUEBAS JAJDJDJDJDJDJDJD </p>
     <p><input type='button' value='Leído' id='Ver' onclick="javascript:vw_nomostrar();"</p>
  </div>
<p><a href="javascript:vw_mostrar();">Ver</a></p>
</body>

<div id="contiene_tabla">
  <table border="0" cellspacing="0" cellpadding="0">
    <thead>
      <tr>
        <th>Nº SOCIO</th>
        <th>INGRESA</th>
        <th>NOMBRES Y APELLIDO</th>
        <th>CATEGORIA</th>
        <th>PUNTOS</th>
        <th> ? </th>
      </tr>
    </thead>
    <tbody>

<?php

require('controlador.php');

    $consulta1 = socios_alerta($conS,$cadena_nueva);

        while ($fila = oci_fetch_array($consulta1, OCI_ASSOC+OCI_RETURN_NULLS)) {

        $vsocio=trim($fila['NUM_SOCIO']);
        $vfecha=trim($fila['FECHA']);
        $vapellido=trim($fila['APELLIDO']);
        $vnombre=trim($fila['NOMBRE']);
        $vcate=trim($fila['CATEGORIA']);
        $vpuntaje=trim($fila['PUNTOS']);
        $comentario=trim($fila['COMENTA']);

        echo "<tr>\n";
        echo "    <td align='center'>" . $vsocio . "</td>\n";
        echo "    <td align='right'>" . $vfecha . "</td>\n";
        echo "    <td align='left'>"  . $vnombre . ", " . $vapellido . "</td>\n";
        echo "    <td align='center'>" . $vcate . "</td>\n";
        echo "    <td align='right'>" . $vpuntaje ."</td>\n";
        echo "    <td align='center'><input type=\"button\" value=\"Ver\" id=\"Ver\" onclick=\"javascript:vw_mostrar('".$comentario."')\";></td>\n";
        echo "</tr>\n";
        
        }
        
        oci_close($conn);

?>
    </tbody>
  </table>
</div>
</body>

</html>
    
answered by 08.08.2018 в 17:55
0

I had to solve this issue and solve it through ajax, I had to change a large part of the code so I do not quote it, but I think it is the indicated way. Of course I appreciate the help received, it made me learn a little more and reason the solution.

    
answered by 10.08.2018 в 19:15