jQuery – agregar y eliminar filas en una tabla
pues pues pues, se me dio por hacer este tutorial gracias a este post:
¿que contiene la aplicación?
- agregación de nueva fila por medio de un formulario a la tabla
- eliminación de una fila obteniendo su id para modificar la base de datos por ajax
- validación de campos de texto enteros, texto y formato e-mail con jquery.validate
- actualización de bases de datos con ajax
- formato de aplicacion usando css
¿que olvide añadir?
- la opción de editar fila, por ejemplo un enlace en la fila y al hacerle click obtener sus datos y modificarlos. no tengan problema en un futuro tutorial hare un ejemplo similar a este.
imagen de la aplicación

descarga
puedes descargar la aplicacion desde el siguiente enlace.

Excelente aporte amigo!
Es exactamente lo que necesitaba, pero mejor que como lo había pensado
saludos desde Fúnes, Argentina!
Esteban López Adriano
Agosto 5, 2009 a 7:06 pm
hola, probe el tutorial…y excelente funcional tal como lo necesitaba..pero al momento de insertalo a mi sitio web….este funciona mal..ya que cuando se desea agregar un nuevo campo, se va la otra pagina, en vez de aparecer en la misma dicho formulario…y asi tambien con modificar, el unico q funciona bien es el eliminar…me podrias ayudar por que sucede esto???
John perea
Agosto 8, 2009 a 8:51 am
@esteban: muchas gracias esteban por los saludos, cualquier duda, pues, aqui estoy.
@john: hola john, podrias darme la direccion donde lo has subido???, asegurate que tienes la version 1.3.2 de jQuery, el jquery.validator en su version 1.5.2… espero tu respuesta.
hector2c
Agosto 8, 2009 a 9:36 am
Hola veo que eres de peru supongo lima igual que yo.. bueno realmente esta simpatico el blog.. me gusta el diseño y buenos articulos
Saludos
albert
Agosto 10, 2009 a 8:25 am
@albert: hola, pues, soy de perú, pero del sur, la pequeña tacna, gracias por el saludo, espero pueda ayudarte en algo, nos vemos.
hector2c
Agosto 10, 2009 a 11:11 am
Hola Hector, me parece una excelente aplicación pero tengo un problema para ver los valores desde agregar.php? salu2
Vengador Anónimo
Agosto 15, 2009 a 6:57 pm
@vengador_anónimo: pues, los valores se envian en formato post, los puedes recuperar desde agregar.php del siguiente modo:
<?php $variable = $_POST['variable']; $nombre = $_POST['nombre']; $sql = "insert into tu_tabla values('$variable', '$nombre')"; mysql_query($sql); ?>cualquier problema no dudes en escribir!, nos vemos!
hector2c
Agosto 20, 2009 a 9:27 am
Saludos buen tutorial, pero hay cierta cosilla que no contempla como por ejemplo si agrego mas de 30 registro y quiero borrar el primero hace un bucle infinito de confirmacion de eliminacion, por otro lado se podria insertar un registro es una posocion especifica???
Elmer
Agosto 22, 2009 a 10:10 am
Hola mira estoy haciendo algo similar a esto para mi sitio, ya habia logrado insertar y eliminar, mi problema es el siguiente, la parte de actualizar, lo que necesito es poner un boton al lado de borrar, lo que tengo pensado es qeu ese boton ejecute una funcion javascrip, en este caso un getjson, y que me cargue el form con los datos a actualizar, que crees tu que es mejor implementacion un campo hidden en el formulario, o que cambie el submit con javascrip,que en ves de ir a la pagina guardar, vaya a la de actualizacion. espero tus observaciones ojala ayas entendido lo que trate de plantear.
pd: Necesito que el actualizar sea en el mismo form de ingreso porque hize el actualizar en una ventana modal y no le gusto al cliente.
saludos
mauricio
Agosto 22, 2009 a 2:29 pm
Hector,
Te felicito por tu invento y muchas gracias!!!!
Saludos desde Chile.
ricardo avalos
Septiembre 5, 2009 a 7:34 pm
Hola sabes encuentro ideal el ejemplo que has puesto, sin embargo , ¿ como guardas todos esos datos de la tabla en la base de datos (Mysql)?
Alan
Octubre 18, 2009 a 10:46 pm
Me seria de utilidad si dieras un ejemplo de buscar pero a ver si me explico: tienes todo tu contenido cargado en el dom osea en inputs… y quieres filtrar solo los imput q vallan coincidiendo con lo q estas actualmente escribiendo….
hermano si pudieras explicarlo te agradeceria q me saques de mi ignorancia lo necesito….
Alexander
Noviembre 10, 2009 a 6:27 pm
muy util la aplicacion…..yo he tratado de implementar la funcion editar!!!! pero he tenido muchos problemas!!
ojala que algun dia lo puedas hacer..
=)
rene
Noviembre 17, 2009 a 12:10 am
hola, como estan todos, disculpen el mal soporte a este pequeño y sencillo trabajo, estoy terminando una nueva “versión”, cuenta con full eventos ajax, bd mysql, y nuevos plugins jquery, les sera de mucha ayuda… nos vemos!
hector2c
Noviembre 17, 2009 a 4:48 pm
hola nuevamente!!! =) ….sabes que todavia no he podido implementar la funcion editar…la idea que tengo es poder hacer click en un icono editar, tal como lo hiciste en eliminar, pero con la diferencia que al hacer click los datos se me muestren en los input de “agregar” y desde ahi poder nuevamente agregarlo …estoy contra el tiempo ya que estoy realizando un proyecto en clases y tu aplicacion me ha servido bastante..
Espero con ansias las nuevas mejoras de tu aplicacion
saludos!!!!!
rene
Noviembre 19, 2009 a 2:12 pm
@rene: hola!!! como estas, waa, te informo que ya casi termino, me falta la parte editar, agrege muuchas cositas, y tambien quite otras que no eran de lo mas optimas!!! uso mysql para hacerlo mas real!!!, nos vemos, date una vuelta mañana por el blog, tal vez ya lo publique…
pta: tambien estoy implementando la parte de edicion, en el mismo formulario
nos vemos!!!
hector2c
Noviembre 19, 2009 a 7:02 pm
hola!!!…espero que lo publiques pronto..para poder probrarlo con mi base de datos que tambien la tengo en mysql…..
espero pronto la publicacion!!!….y en cuanto lo pruebe te cuento que tal me fue =)
saludos y gracias por la respuesta!!!
rene
Noviembre 20, 2009 a 8:38 pm
hola hector!!!….disculpa nuevamente por las molestias, pero me gustaria saber cuando tendrias publicada la aplicacion…para poder implementarlo en mi proyecto.
gracias…espero tu respuesta (cualquier cosa tienes mi mail
)…
Saludos!!!!! y nuevamente disculpa las molestias…
rene
Noviembre 22, 2009 a 1:35 pm
hola!!! disculpa nuevamente molestarte pero me gustaria saber si has podido implementar la funcion editar en tu aplicacion…porque lo que es yo todavia tengo problemas para implementarlos…
ojala me puedas ayudar o orientar un poco en esto ya que no soy muy bueno para el lenguaje web..
saludos!!!!
rene
Noviembre 28, 2009 a 12:43 am