2

Preciso de ajuda para conseguir puxar os valores que estão dentro de uma table. Eu fiz um código usando table com $sql = "select * from equipamentos"; para puxar os dados que implementei no Banco Mysql, mas especificamente na Tabela Equipamentos. Eu consigo usar os valores, que estão na table, em outras paginas mas não é o ponto que eu quero. Eu desejo que ao fazer um click em uma das linhas da Table os valores que estão naquela linha sejam direcionados a alguns Inputs que estão na mesma pagina que a Table. e se possível que o usuário não possa alterar os valores que chegaram nos inputs.

Procurei em outros tópicos do site e não achei problemas parecidos com o meu!

Esse é a parte do Código que desejo implementar oque falei acima

    <form >
           <div class="col-md-1 col-sm-1 col-xs-1 form-group form-group-lg">
 id:<br/>
  <div class="form-group your-equip">
    <input class="wpcf7-form-control wpcf7-text  wpcf7-validates-as-required form-control form-control" name="nomeequip" type="int">
  </div>
   </div>
           <div class="col-md-4 col-sm-9 col-xs-9 form-group form-group-lg">
 Nome Do Equipamento:<br/>
  <div class="form-group your-equip">
    <input class="wpcf7-form-control wpcf7-text  wpcf7-validates-as-required form-control form-control" name="nomeequip">
  </div>
   </div>
    <div class="col-md-5 form-group form-group-lg"> Marca:<br/>
      <div class="form-group marca">
        <input class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required  form-control form-control" name="marcaequip" >
      </div> 
    </div>
      <div class="col-md-5 col-sm-10 col-xs-10 form-group form-group-lg">
 Cor:<br/>
  <div class="form-group cor">
    <input class="wpcf7-form-control wpcf7-text  wpcf7-validates-as-required form-control form-control" name="corequip" >
  </div>
   </div>
    <div class="col-md-5 form-group form-group-lg"> Categoria<br/>
      <div class="form-group Categoria">
        <input class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required  form-control form-control" name="categoriaequip" >
      </div> 
      </div>
      
    <div>
      <div class="col-md-12 form-group form-group-lg">
      <center> <h2>Equipamentos
</h2></center>
</div>

 <table border="2"  id='table'>
 <thead>
<tr>
  <th>Id</th>
  <th>Equipamento</th>
  <th>Cor</th>
  <th>Marca</th>
  <th>Categoria</th>
</tr>
<style type="text/css">
  tbody tr:hover{background-color:#555} 

</style>
</thead>
<tfoot>
    <tr>
        <td colspan="7"><center><script language=javascript type="text/javascript">
    dayName = new Array ("domingo", "segunda", "terça", "quarta", "quinta", "sexta", "sábado")
monName = new Array ("janeiro", "fevereiro", "março", "abril", "maio", "junho", "agosto", "outubro", "novembro", "dezembro")
now = new Date
document.write (" Hoje é " + dayName[now.getDay() ] + ", " + now.getDate () + " de " + monName [now.getMonth() ]   +  " de "  +     now.getFullYear () + "   ")
document.write ( + now.getHours() + ":" + now.getMinutes() + ":" + now.getSeconds() )
</script></center></td>
    </tr>
</tfoot>
<center>
  <?php
            include_once "conexao.php"; 
            $sql = "select * from equipamentos";
            $result = mysql_query($sql,$con);
            if($result){
            while($linha1 = mysql_fetch_array($result)){
?>

<tbody>
       <tr>
          <td> <?php echo $linha1['id_equipamento'];?></td>
           <td> <?php  echo $linha1['nomeequip'];?></td>
           <td> <?php  echo $linha1['corequip'];?></td>
           <td> <?php  echo $linha1['marcaequip'];?></td>
           <td> <?php  echo $linha1['categoriaequip'];?></td>      
       </tr>
</tbody>

<?php
          }//fim do while
          }//fim do if  
          mysql_close($con);
?>
</table> 
    </div>
  </form>

1 Resposta 1

1

Primeiro você precisa redefinir o name do input que recebrá o ID do produto que esta o mesmo do nome do produto

Segundo, atribuir um identificador para cada linha, achei que seria mais facil assim:

<tr id="<?php echo $linha1['id_equipamento']; ?>">

Terceiro, atribuir um atributo aos td contendo o nome do nome dos respectivos campos que receberão as informações, no meu exemplo uso o data-target pois o Jquery identifica usando .data('target'):

<td data-target="idequip"> <?php echo $linha1['id_equipamento'];?></td>
<td data-target="nomeequip"> <?php echo $linha1['nomeequip'];?></td>
<td data-target="marcaequip"> <?php echo $linha1['corequip'];?></td>
<td data-target="corequip"> <?php echo $linha1['marcaequip'];?></td>
<td data-target="categoriaequip"> <?php echo $linha1['categoriaequip'];?></td>

Em seguida com uma função em Jquery você consegue o resultado:

<script type="text/javascript">
    $('tbody tr').click(function(){
        var id = $(this).attr('id');
        $.each($('#'+id+" td"),function(){
            var target = $(this).data('target');
            $("input[name='"+target+"']").val($(this).html());
        });
    });
</script>

Para evitar a edição dos inputsque irão receber os valores, basta adicionar o atributo disabled ou readonly a eles.

Referencia do atributo readonly

Referencia do atributo disabled

0

Você deve fazer log-in para responder a esta pergunta.