Agregar Borrar campos usando ajax parte 2
Categories: AJAX - Tags: formulario, javascript, jqueryEn un post anterior expliqué como se podían agregar campos usando jquery, varias personas me preguntaron como hacer para borrar un campo específico, pues es muy simple en realidad, veamos:
Agregando campos
Necesitamos hacer que se agreguen campos pero además que estos aparezcan con un link que nos permita borrarlos, además para poder identificarlos vamos a ponerle un contador.
1 2 3 4 5 | emails=0; function agregar() { emails=emails+1; $("#campos").append('<li class="email'+emails+'"><input type="text" name="email[]" size="25" /> <a href="#" onclick="javascript:borrar('+emails+');">Borrar</a></li>'); } |
De esta forma se creará un li con una clase email1, email2, email3, etc. y un link con un javascript que invoca a la función borrar(1), borrar(2), etc.
Borrando los campos
La función que borra los campos que ya no requerimos es muy simple, únicamente un selector jquery que busca la clase email1, email2… o la que corresponda y con remove se elimina, ese return false evita que “salte” la página cuando le damos click al link borrar.
1 2 3 4 | function borrar(cual) { $("li.email"+cual).remove(); return false; } |
Como ven con sólo un par de líneas ya esta funcionando, espero les sea util este post.
10 puntos Migue !!
hola, tengo un problema, cual seria la opcionque debo incluir en caso de validar mis inputs … te agradeceria..
[...] Varios lectores me preguntaban como hago para borrar los campos ingresado, eso lo ven AQUI // under: AJAX, javascript Tags: AJAX, formulario, jquery Digg it Add to del.icio.us [...]
Excelente tutorial, lo he adaptado a mis necesidades y funcionó de maravilla!
Saludos
No logro borrar los input que pasara…que tendre mal
hola tengo problemas al querer borrar un input, que pasara con el codigo.
Hola, mi duda es la siguiente sirve para agregar dos o mas cajas de texto al mismo tiempo???
Saludos
y gracias muy util la información