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.
Últimos Comentarios