Foros del Web » Programando para Internet » Jquery »

Problema con editar una fila con Jquery!!!!

Estas en el tema de Problema con editar una fila con Jquery!!!! en el foro de Jquery en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 25/11/2009, 20:13
 
Fecha de Ingreso: noviembre-2009
Mensajes: 13
Antigüedad: 15 años
Puntos: 0
Problema con editar una fila con Jquery!!!!

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 =)
  #2 (permalink)  
Antiguo 26/11/2009, 08:12
Avatar de hector2c  
Fecha de Ingreso: noviembre-2007
Ubicación: Perú - Tacna
Mensajes: 979
Antigüedad: 17 años
Puntos: 25
Pregunta Respuesta: Problema con editar una fila con Jquery!!!!

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...
__________________
blog: hector2c.wordpress.com
email: [email protected]
  #3 (permalink)  
Antiguo 26/11/2009, 08:55
Avatar de mayid
Colaborador
 
Fecha de Ingreso: marzo-2009
Ubicación: BsAs
Mensajes: 4.014
Antigüedad: 15 años, 7 meses
Puntos: 101
Respuesta: Problema con editar una fila con Jquery!!!!

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.
  #4 (permalink)  
Antiguo 26/11/2009, 13:41
Avatar de hector2c  
Fecha de Ingreso: noviembre-2007
Ubicación: Perú - Tacna
Mensajes: 979
Antigüedad: 17 años
Puntos: 25
Respuesta: Problema con editar una fila con Jquery!!!!

mm, los famosos "edit in place"

AQUI AQUI MAS INFO!!
__________________
blog: hector2c.wordpress.com
email: [email protected]
  #5 (permalink)  
Antiguo 26/11/2009, 15:26
 
Fecha de Ingreso: noviembre-2009
Mensajes: 13
Antigüedad: 15 años
Puntos: 0
Respuesta: Problema con editar una fila con Jquery!!!!

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...
  #6 (permalink)  
Antiguo 26/11/2009, 16:11
Avatar de mayid
Colaborador
 
Fecha de Ingreso: marzo-2009
Ubicación: BsAs
Mensajes: 4.014
Antigüedad: 15 años, 7 meses
Puntos: 101
Respuesta: Problema con editar una fila con Jquery!!!!

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

Que tipo de respuesta PHP generas? json? O texto plano?
  #7 (permalink)  
Antiguo 26/11/2009, 17:03
 
Fecha de Ingreso: noviembre-2009
Mensajes: 13
Antigüedad: 15 años
Puntos: 0
Respuesta: Problema con editar una fila con Jquery!!!!

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...
  #8 (permalink)  
Antiguo 26/11/2009, 19:16
Avatar de mayid
Colaborador
 
Fecha de Ingreso: marzo-2009
Ubicación: BsAs
Mensajes: 4.014
Antigüedad: 15 años, 7 meses
Puntos: 101
Respuesta: Problema con editar una fila con Jquery!!!!

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.
  #9 (permalink)  
Antiguo 05/04/2011, 14:32
 
Fecha de Ingreso: enero-2011
Mensajes: 60
Antigüedad: 13 años, 9 meses
Puntos: 0
Respuesta: Problema con editar una fila con Jquery!!!!

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?
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 05:17.