Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
pagina.php
<!DOCTYPE html>
<html lang="en" xmlns="[url=[http://www.w3.org/1999/xhtml](http://www.w3.org/1999/xhtml)][http://www.w3.org/1999/xhtml](http://www.w3.org/1999/xhtml) [/url]">
<head>
<meta charset="utf-8" />
<title>Navegador em tabela HTML</title>
<style type="text/css">.tabelaEditavel {
border:solid 1px;
width:500px
}.tabelaEditavel td {
border:solid 1px;
}.tabelaEditavel .celulaEmEdicao {
padding: 0;
}.tabelaEditavel .celulaEmEdicao input[type=text]{
width:100%;
border:0;
background-color:rgb(255,253,210);
}
</style>
<script type="text/javascript" src="[url=[http://code.jquery.com/jquery-1.8.3.min.js](http://code.jquery.com/jquery-1.8.3.min.js)][http://code.jquery.com/jquery-1.8.3.min.js](http://code.jquery.com/jquery-1.8.3.min.js) [/url]"></script>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<table class="tabelaEditavel">
<thead>
<tr>
<th>Código</th>
<th>Nome</th>
<th>E-mail</th>
<th>Telefone</th>
</tr>
</thead>
<tbody>
<tr>
<td>001</td>
<td>João Carlos</td>
<td>joca@email.com</td>
<td>(21) 9999-8888</td>
</tr>
<tr>
<td>002</td>
<td>Maria Silva</td>
<td>mariasilva@mail.com</td>
<td>(81) 8787-8686</td>
</tr>
<tr>
<td>003</td>
<td>José Pedro</td>
<td>zepedro@meuemail.com</td>
<td>(84) 3232-3232</td>
</tr>
</tbody>
</table>
</body>
</html>$(function () {
$("td").dblclick(function () {
var conteudoOriginal = $(this).text();
$(this).addClass("celulaEmEdicao");
$(this).html("<input type='text' value='" + conteudoOriginal + "' />");
$(this).children().first().focus();
$(this).children().first().keypress(function (e) {
if (e.which == 13) {
var novoConteudo = $(this).val();
$(this).parent().text(novoConteudo);
$(this).parent().removeClass("celulaEmEdicao");
}
});
$(this).children().first().blur(function(){
$(this).parent().text(conteudoOriginal);
$(this).parent().removeClass("celulaEmEdicao");
});
});
});
Ao editar na tabela ele mostra o resultado alterado,** mas gostaria de saber se há alguma forma de pegar o valor desses dados alterados para passar pra página de enviar pro banco de dados?**Se alguem tiver um código diferente desse, mas que altere a tabela dinamicamente pra enviar os novos dados para o banco, também serve!
Carregando comentários...