Show and Hide Table Lines [duplicate]

Navigation
0

There is in the code the button displays / hidden, referenced a JavaScript function, however, the button only works by bringing the last record of the database, never the record for the line that it is and only displays after the first row of the table.

For example, even if I click the button that is referencing the 4th record, it displays the <div> in the bottom of the 1st row of the table, as I do so that $row['chave'] is below each row according to with your order in the table and only display or hide according to the action on the button, below code below; 

foreach($result as $row) {

$database = date_create($row['expira']);
$datadehoje = date_create();
$resultado = date_diff($database, $datadehoje);
$intervalo = date_interval_format($resultado, '%a');

if($intervalo > 5){
    $classe = "";
}else if($intervalo <= 2){
    $classe = "color-alert";
}else if($intervalo > 2 && $intervalo <=5){
    $classe ="color-warn";
}


//echo $datab;
// echo $datac;
echo '<tr class="'.$classe.'">';

echo '<td ><center>'.$row['cliente'].'</center></td>';
echo '<td ><center>'.$row['cnpj'].'</center></td>';
echo '<td ><center>'.$row['registro'].'</center></td>';
echo '<td ><center>'.$row['versao'].'</center></td>';
echo '<td ><center>'.$row['expira'].'</center></td>';
echo '<td><center> '
. '<a class="btn btn-primary" href="editar.php?id='.$row['id'].'">'
        . '<i class="fas fa-edit"></i> Editar</a>    </td>';
echo'<td><button id="btnExibeOculta" class="btn" onclick="ocultarExibi();">'
. 'Exibir/Ocultar</button></td>';
echo'</tr>';
echo'<tr>    
    <td>
    <div id="dvConteudo" style="display:none;" >'.$row['chave'].'</div>
    </td>
    </tr>';
}

Javascript code: 

<script>

    var visibilidade = true;
    function ocultarExibir() { 
        if (visibilidade) {
            document.getElementById("dvConteudo").style.display = "none";
            visibilidade = false;
        } else {
            document.getElementById("dvConteudo").style.display = "block";
            visibilidade = true;
            }
    }
</script>
    
asked by anonymous 19.12.2018 / 16:00

1 answer

0

Let's see if I can help:

You forgot the 'r' in the Javascript function call hideView () on: 

echo'<td><button id="btnExibeOculta" class="btn" onclick="ocultarExibi();">'

Well, if you want to display $ row ['key'] as soon as the load code changes     display: none; for     display: block; in: 

<div id="dvConteudo" style="display:none;" >'.$row['chave'].'</div>

Change your Javascript code to: 

<script>

  function ocultarExibir() { 

      var visibilidade = document.getElementById("dvConteudo").style.display;

      if ( visibilidade == "none") {
        document.getElementById("dvConteudo").style.display = "block";
      } else {
        document.getElementById("dvConteudo").style.display = "none";
      }

  }

</script>
    
19.12.2018 / 17:38
Checking call execution time in ADVPL Show Static Map Google with Picasso on Android