Agregar más campos jQuery con botón Quitar. Mediante el uso de jquery puede añadir o duplicar más campos de entrada con el botón de borrado cerca de él y puede eliminar el archivo de borrar haga clic en el botón. Este método en requerido por clientes exigentes a la hora de requerir sus plataformas web, sin embargo aquí les traigo la solución para incrementar mas input, o caso contrario eliminarlas.
El lenguaje de Marcas HTML
<button id="add">Agregar Campos</button> <div id="items"> <div><input type="text" name="input[]"></div> </div>
En primer lugar tenemos un único cuadro de entrada dentro de un div con el id de «items» y un botón que dice «Agregar Campos».
Agregar más campos jQuery con botón Quitar
Dentro de $(document).ready función de colocar el siguiente código jQuery.
jQuery code
//when the Add Field button is clicked
$("#add").click(function (e) {
//Append a new row of code to the "#items" div
$("#items").append('<div><input name="input[]" type="text" /><button class="delete">Delete</button></div>'); });
Ahora, cada vez que haga clic en «Añadir Campo» un nuevo campo de entrada con el botón eliminar.
Cuando una eliminación clic en el botón necesitamos quitar el campo de entrada correspondiente utilizando el código de abajo.
Boton Borrar
$("body").on("click", ".delete", function (e) {
$(this).parent("div").remove();
});
Gracias por visitarnos, eso es todo por este articulo. En el siguiente tutorial nuevas novedades, hasta la proxima.
Referencia:
Remove Button
Descargar Demo
