Selecionar ID's da mesma linha tr da tabela html com jquery

[vmolina 8]

Bom dia pessoal,

 

 

Estou criando um sistema simples para a empresa controlar o horário do funcionário, na parte do admin tem uma opção para ajustar o horário do funcionário como mostra o exemplo abaixo.

 

Quando clico no botão editar ilustrado pela img do láis é habilitado os campos inputs para alterar os horários, edito e salvo na mesma linha da tabela html, Todo esse procedimento consigo realizar com apenas uma linha na tabela usando o jquery, porém serão criadas várias linhas(dinamicamente php+mysql) para que o operador escolha a que deseja alterar, gostaria de selecionar através do jquery a linha que foi clicada no botao edite e habilitar os inputs da mesma para realizar o procedimento.

 

<table width="950" border="0" cellspacing="5" cellpadding="0" id="ajustehr">
  <thead> 
  <tr>
    <td height="27" colspan="8" style="padding:10px; border-bottom:1px solid #666;">Funcionário: <b><?php echo $l['nome']; ?></b></td>
  </tr>
  <tr>
    <td width="84" align="center" style="padding:10px; border-bottom:1px solid #666;">Data</td>
    <td width="83" align="center" style="padding:10px; border-bottom:1px solid #666;">Hora1</td>
    <td width="129" align="center" style="padding:10px; border-bottom:1px solid #666;">Hora2</td>
    <td width="129" align="center" style="padding:10px; border-bottom:1px solid #666;">Hora3</td>
    <td width="129" align="center" style="padding:10px; border-bottom:1px solid #666;">Hora4</td>
    <td width="129" align="center" style="padding:10px; border-bottom:1px solid #666;">Editar Horário</td>
  </tr>
  </thead>
  <tbody> 
  <?php 
  while($r = mysql_fetch_array($sql_funcionario_executar)){
   ?>   
  <tr>
    <td align="center"><?php echo databr($r['data']); ?>
      <input type="hidden" value="<?php echo $r['data']; ?>" id="dtr" />
      <input type="hidden" value="<?php echo $l['codigo']; ?>" id="id_user" /></td>
    <td align="center"><input name="hr1" id="hr1" type="text" value="<?php echo $r['hora1']; ?>" readonly="readonly" /></td>
    <td align="center"><input name="hr2" id="hr2" type="text" value="<?php echo $r['hora2']; ?>" readonly="readonly" /></td>
    <td align="center"><input name="hr3" id="hr3" type="text" value="<?php echo $r['hora3']; ?>" readonly="readonly" /></td>
    <td align="center"><input name="hr4" id="hr4" type="text" value="<?php echo $r['hora4']; ?>" readonly="readonly" /></td>
    <td align="center"><img src="img/1368548404_badge_edit.png" width="32" height="32" class="btn_edit" />
      <div class="step2"><img src="img/accept.png" width="32" height="32" id="btn_save" style="padding-right:10px;" /> <img src="img/cancel.png" width="32" height="32" id="btn_cancel" /></div></td>
  </tr>
  <?php } ?>
  </tbody>
  <tfoot>
	<tr>
    	<td colspan="6" align="center" class="c-tfoot"></td>
    </tr>
</tfoot>
</table>

 

 

Script onde habilito os inputs[text] para edição.

$('tr .btn_edit').click(function(){
		
		//console.log(this);
		
		$('#hr1').attr('readonly',false);
		$('#hr2').attr('readonly',false);
		$('#hr3').attr('readonly',false);
		$('#hr4').attr('readonly',false);
		
		$('#hr1').css({border:"1px solid #069"});
		$('#hr2').css({border:"1px solid #069"});
		$('#hr3').css({border:"1px solid #069"});
		$('#hr4').css({border:"1px solid #069"});
		
		$('#hr1').focus();
		
		$(this).css({display:"none"});
		
		$('.step2').css({display:"block"});
		
		});

 

 

 

Desde já agradeço,

 

Vitor Molina

 

[angelorubin 142]

Boa tarde,

Veja se ajuda - http://angelorubin.besaba.com/Controle_Horario/horario.php

Depois é só fazer um $.ajax e atualizar no banco.

Espero que ajude.

[vmolina 8]

angelorubin muito bom o exemplo, vou estudar e te falo o resultado.

 

Valeu obrigado.