Problema con editar una fila con Jquery!!!!

[rfonseca]

hola amigos!!!!...

El problema es que no puedo editar una fila mediante Jquery..les explico:

en un archivo miembros.php tengo una tabla que muestro los datos de usuarios por
ej:
nombre,apellido_1,apellido_2 .

Al final de cada fila tengo dos imagenes que son eliminar y editar....el eliminar lo hace sin problema y la fila del miembro que quiero eliminar desaparace automaticamente de la tabla...

el problema principal es que no se como al hacer click sobre la imagen de "editar" este me muestre los datos del usuario a editar y los guarde en mi base de datos (mysql)..y que se modifique en mi tabla sin que se recarge la pagina...

este es un quebradero de cabeza que llevo en dias!!!...si alguien sabe de alguna forma de hacerlo...

de antemano gracias =)

[hector2c]

pues, en en la imagen editar debes agregar un enlace similar a:

<a href="javascript: fn_modificar(1);"><img src="editar.png"></a>
<a href="javascript: fn_modificar(2);"><img src="editar.png"></a>
...

Ahora mediante ajax, retornas sus valores... eso si... debes usar json, para poder segmentar los datos

y los distribuyes en los campos de texto...

[mayid]

Usa un inline editor. Son lo mejor. Jquery tiene algunos, y son muy sencillos de implementar y de usar. Estan basados en ajax, asi que no habra recarga.

[hector2c]

mm, los famosos "edit in place"

AQUI AQUI MAS INFO!!

[rfonseca]

bueno lo he tratado de hacer como dijo hector2c..lo que tengo es esto!!!..."miembros.php"

Código PHP:

 <table id="tabla" class="miembros">
                <thead>
                        <tr>
                            <th colspan="2"><img src="delete.png" /> Elimina Integrantes</th>
                            <th colspan="2"><img src="editar1.gif" /> Edita Integrantes</th>
                        </tr>
                </thead>
                <thead>
                    <tr>
                        <th>Nombre</th>
                        <th>Apellido Paterno</th>
                        <th>Apellido Materno</th>
                    </tr>
               </thead>
               <tbody>
                        <?php
                                include("conexion.php");
    
                                $con_miembro = "select *from miembros;"; 
                                $miembros = mysql_query($con_miembro,$conect);
                                
                                while($row = mysql_fetch_array($miembros))
                                {
                                        echo "<tr>";
                                        echo "<td style='display:none' id='miembro'>".$row['id_miembro']."</td>";
                                        echo "<td>".$row['nom_miembro']."</td>";
                                        echo "<td>".$row['apellido_pat']."</td>";
                                        echo "<td>".$row['apellido_mat']."</td>";
                                        echo " <td><a class='elimina'><img src='delete.png'/></a></td>";
                                        echo " <td><a class='edita'><img src='editar1.gif'/></a></td>";
                                        echo "</tr>";
                                }                        
                        ?>
                </tbody>
            </table>  

y desde este archivo llamo a miembros.js donde eliminar lo hace bien...

$("a.elimina").click(function(){
id = $(this).parents("tr").find("td").eq(0).html();
nom = $(this).parents("tr").find("td").eq(1).html();
pat = $(this).parents("tr").find("td").eq(2).html();
mat = $(this).parents("tr").find("td").eq(3).html();
eliminar = confirm("Desea eliminar el usuario: " /*+ id + " "*/ + nom + " " + pat + " " + mat );
if (eliminar){
$(this).parents("tr").fadeOut("normal", function(){
$(this).remove();
alert("El usuario: " + nom + " " + pat + " " + mat + " fue eliminado");

$.post("elimina_miembro.php", {id_miembro: id})


})
}
});
};
hasta aqui todo bien!!!!!....ahora lo que llevo de editar que es mi problema!!

function editar(){

$("a.edita").click( function(){

//var valor = $(this).attr("value");
//var valor = $(this).parents("tr").find("td").eq(0).html();
id = $(this).parents("tr").find("td").eq(0).html();
nombre = $(this).parents("tr").find("td").eq(1).html();
paterno = $(this).parents("tr").find("td").eq(2).html();
materno = $(this).parents("tr").find("td").eq(3).html();
alert(" "+ id + " " + nombre + " " + paterno + " " + materno);
$.post("editar_miembro.php",
{ nombre: nom, paterno: pat, materno:mat },
function(data){
//alert(id);
$("#id").show().html(data);
}
);
return false;
});
};

que lo que hago es obtener el id del integrante... y lo que quiero es que en el php en click al editar este me muestre el nombre, apellido_1,apellido_2....y con el id de ese integrante poder hace un UPDATE para modificar el nombre con los apellidos...

[mayid]

Y que te falta? Obtener mas de una variable desde PHP, no?

Que tipo de respuesta PHP generas? json? O texto plano?

[rfonseca]

Código PHP:

  while($row = mysql_fetch_array($miembros)) 
                                { 
                                        echo "<tr>"; 
                                        echo "<td style='display:none' id='miembro'>".$row['id_miembro']."</td>"; 
                                        echo "<td>".$row['nom_miembro']."</td>"; 
                                        echo "<td>".$row['apellido_pat']."</td>"; 
                                        echo "<td>".$row['apellido_mat']."</td>"; 
                                        echo " <td><a class='elimina'><img src='delete.png'/></a></td>"; 
                                        echo " <td><a class='edita'><img src='editar1.gif'/></a></td>"; 
                                        echo "</tr>"; 
                                }  
   

$("a.edita").click( function(){

id = $(this).parents("tr").find("td").eq(0).html();
nom = $(this).parents("tr").find("td").eq(1).html();
pat = $(this).parents("tr").find("td").eq(2).html();
mat = $(this).parents("tr").find("td").eq(3).html();
alert(" "+ id + " " + nombre + " " + paterno + " " + materno);
$.post("editar_miembro.php",
{ nombre: nom, paterno: pat, materno:mat },
function(data){
//alert(id);
$("#id").show().html(data);
}
);
return false;
});


como puedes ver en mi pagina principal que muestro en una tabla todos los datos de los usuarios y a cada fila le agrego una imagen editar...con jquery en mi archivo.js al hacerle click a la imagen obtengo los datos de esa fila....y lo quiero es que pueda modificar esos datos obtenidos y enviarlos a editar_miembro.php....y que esa modificacion se me muestre automaticamente en la tabla que muestro.....no se si me explique bien..o a lo mejor mi idea es muy complicada y me estoy estresando de gusto...

[mayid]

Mira, no se si ya lo dije, pero los editores online, por ejemplo los "inline editors" o tambien los WYSIWYG trabajan con iframes. Basicamente reemplazan un campo de texto (inputs o textareas) por un iframe especial, que permite editar una web online.

No se sugerirte ahora un script jquery especifico, pero estaria bueno que te familiarices con esos sitemas. Los que uso yo permiten editar un texto haciendoles click...

A ver... momento! Estoy complicando las cosas. Lo unico que necesitas vos es incluir en tus campos <td> un textarea. Asi vas a poder modificar el texto y enviarlo como formulario a tu PHP. Es super facil.

Pero volviendo a los sistemas "edit in place" , te invito a que visites uno:
http://libasoles.com.ar/autoadministrable/subida.php
clave: admin. Luego haces click en cualquier fotito para abrir un sistema de comentario.

[Jsc_dark25]

Amigo, yo tngo un problema similar, pero en si mi problema es al eliminar una fila, suponiendo q tngo 10 filas(registros), entonces elimino la fila 5, y me sale varios Alert("Usuario" + x + "Eliminado"). Y a veces solo una vez. Me podrias ayudar por fa?