table_edit_ajax.php
Código PHP:
include 'conn.php'; //conexion a la base de datos
if($_POST['id'])
{
$id = mysql_escape_String($_POST['id']);
$firstname = mysql_escape_String($_POST['firstname']);
$lastname = mysql_escape_String($_POST['lastname']);
$sql = "UPDATE tabla SET valor='$firstname',stock='$lastname' WHERE id='$id'";
mysql_query($sql) or die(mysql_error());
}
esto va antes que cierre el head
el jquery que tengo es 1.5 (por las dudas)
Código:
<script type="text/javascript" src="js/s/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$(".edit_tr").click(function()
{
var ID=$(this).attr('id');
$("#first_"+ID).hide();
$("#last_"+ID).hide();
$("#first_input_"+ID).show();
$("#last_input_"+ID).show();
}).change(function()
{
var ID=$(this).attr('id');
var first=$("#first_input_"+ID).val();
var last=$("#last_input_"+ID).val();
var dataString = 'id='+ ID +'&firstname='+first+'&lastname='+last;
$("#first_"+ID).html('<img src="load.gif" />'); // Loading image
if(first.length>0&& last.length>0)
{
$.ajax({
type: "POST",
url: "table_edit_ajax.php",
data: dataString,
cache: false,
success: function(html)
{
$("#first_"+ID).html(first);
$("#last_"+ID).html(last);
}
});
}
else
{
alert('Enter something.');
}
});
// Edit input box click action
$(".editbox").mouseup(function()
{
return false
});
// Outside click action
$(document).mouseup(function()
{
$(".editbox").hide();
$(".text").show();
});
});
</script>
lista.php
Código PHP:
<table>
<tr>
<td class="col">des1</td>
<td class="col">des2</td>
<td></td>
</tr>
<?php
$conexion = mysql_connect ('localhost','root','') or die ('No hay conexión a la base de datos');
$db = mysql_select_db ('tubase',$conexion) or die ('no existe la base de datos.');
$consulta = "SELECT * FROM tutabla ORDER BY id DESC";
$resultado = mysql_query($consulta);
$cant = mysql_num_rows($resultado);
while($fila=mysql_fetch_array($resultado))
{
$id = $fila['id'];
$des1 = $fila['descripcion'];
$des2 = $fila['text'];
?>
<tr id="<?php echo $id; ?>" class="edit_tr">
<td class="edit_td">
<span id="first_<?php echo $id; ?>" class="text"><?php echo $des1; ?></span>
<input type="text" value="<?php echo $val; ?>" class="editbox" id="first_input_<?php echo $id; ?>"/>
</td>
<td class="edit_td">
<span id="last_<?php echo $id; ?>" class="text"><?php echo $des2; ?></span>
<input type="text" value="<?php echo $sto; ?>" class="editbox" id="last_input_<?php echo $id; ?>"/>
</td>
</tr>
<?php
} mysql_close();
?>
</table>
css
Código HTML:
.editbox {display:none}
.edit_tr:hover {cursor:pointer;}
Acá hay un poco de todo... cosas que hice y que saque de otros lados... espero sirva