0

Tenho uma função JS para ocultar/mostrar linha da tabela, a mesma esta dentro de um loop for. Porém estou tendo dificuldades para ativar a mesma. Quando executo tal função fora do loop a mesma funciona perfeitamente, mas quando passo para o for, a história é outra.

Gostaria muito de ajuda com este problema.

Segue código PHP e função JS

<script>
    function Mostrar(x){
        if(document.getElementById(x).style.display == 'none'){
            document.getElementById(x).style.display = 'table-row';
        }else{
            document.getElementById(x).style.display = 'none';
        }
    }
</script>

<?php

$tl_debito = 0;
if($_SESSION['debito'] <> ""){
    $tl_debito = count($_SESSION['debito']);
}
$total_desp = 0;
print
  "<table width='100%' border='1'>
    <tr align='center' bgcolor='#999'>
      <td>PROCESSO</td>
      <td>SETOR</td>
      <td>IDENTIFICAÇÃO</td>
      <td>NR REGISTRO</td>
      <td>VL DESPESA</td>
      <td>OBSERVAÇÕES</td>
    </tr>";
for($i = 0; $i < $tl_debito; $i++){
    $total_desp += $_SESSION['debito'][$i]->SUM;
    $obj_proc = $obj_pdo->getTabProcesso($_SESSION['debito'][$i]->CD_PROCESSO,"","");
    $_SESSION['proc'] = $obj_proc;
    print
      "<tr align='center' onClick='Mostrar('linha')'>
        <td class='texto'>".$_SESSION['debito'][$i]->CD_PROCESSO."</td>
        <td class='texto'>".$_SESSION['debito'][$i]->SETOR."</td>
        <td class='texto'>".$_SESSION['debito'][$i]->IDT_PROCESSO."</td>
        <td class='texto'>".$_SESSION['debito'][$i]->NR_REGISTRO."</td>
        <td class='texto'>".number_format($_SESSION['debito'][$i]->SUM,"2",",",".")."</td>
        <td class='texto'>".$_SESSION['proc'][0]->OBSERVACAO."</td>
      </tr>
      <tr align='center' class='linha' id='linha'>
        <td class='texto'>".$_SESSION['debito'][$i]->CD_PROCESSO."</td>
      </tr>";
}
print
   "<tr align='center'>
      <td colspan='5'> TOTAL DESPESAS </td>
      <td colspan='1'>".number_format($total_desp,"2",",",".")."</td>
    </tr>
   </table>";

?>
2
  • Eu já tentei isso @Victor, porém quando a linha é mostrada, a mesma aparece toda dentro da primeira célula. Mas se você tiver alguma outra forma de fazer isso, ficaria muito grato. 10/11/2017 às 12:47
  • Tenta onClick='Mostrar(\"linha\")' 10/11/2017 às 13:13

1 Resposta 1

0

Você pode printar a tr da tabela com uma classe e um atributo data e depois adicionar os eventos via javascript, assim:

(Você não precisa do onClick aqui)

<tr align='center' class='show' data-line="<?php echo $i ?>">...</tr>

Adicionar os o evento de click nas trs com a função toggleLine para esconder ou mostrar a linha:

<script type="text/javascript">
        var lines = document.querySelectorAll('.show');
            for (var i = 0; i < lines.length; i++) {
            lines[i].addEventListener("click", (event) => {
                toggleLine(event.currentTarget.getAttribute('data-line'))
            });
        }

        function toggleLine(linePosition) {
            var element = document.querySelectorAll('.line-tr')[linePosition]
            console.log(element.style.display, 'display', element)
            if (element.style.display == '' || element.style.display == 'block') {
                element.style.display = 'none'
            } else {
                element.style.display = 'block'
            }
        }
</script>

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 .