Limpiar todos los campos de un formulario con jquery
Ejemplo de como reiniciar o limpiar todos los campos de un formulario utilizando un poco de jquery, este método esta muy presente en formulario de búsqueda avanzado donde tenemos múltiples campos con parámetros almacenados sobre todo campos tipo select.
A veces resulta incómodo ir cambiando un por uno y sale mas a cuenta hacer un reset completo del formulario que hace de filtros de búsqueda , esto lo conseguimos utilizando un poco de jquery. Vamos a ver un par de ejemplos uno sencillo y otro un poco mas avanzado aunque los dos son bastante eficaces.
Si en nuestro formulario tenemos campos de diferentes tipos es decir de tipo text, tipo select, textarea etc lo podemos hacer de la siguiente manera:
Ahora vamos con el ejemplo sencillo, si solo tenemos campos de texto es tan sencillo como hacer lo siguiente:
Editado
A veces resulta incómodo ir cambiando un por uno y sale mas a cuenta hacer un reset completo del formulario que hace de filtros de búsqueda , esto lo conseguimos utilizando un poco de jquery. Vamos a ver un par de ejemplos uno sencillo y otro un poco mas avanzado aunque los dos son bastante eficaces.
Si en nuestro formulario tenemos campos de diferentes tipos es decir de tipo text, tipo select, textarea etc lo podemos hacer de la siguiente manera:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> <script> function resetform() { $("form select").each(function() { this.selectedIndex = 0 }); $("form input[type=text] , form textarea").each(function() { this.value = '' }); } </script> <form> <label for="nombre">Nombre</label> <input type="text" name="nombre" value="Alberto"> <label for="opciones">Opciones</label> <select name="opciones"> <option value="">Selccionar opciones</option> <option value="1" selected>Opción 1</option> </select> <label for="mensaje">Opciones</label> <textarea name="mensaje">Lorem ipsum dolor sit.</textarea> <input type="submit" value="Enviar"> <input type="button" onclick="resetform()" value="Reiniciar"> </form>Demo
Ahora vamos con el ejemplo sencillo, si solo tenemos campos de texto es tan sencillo como hacer lo siguiente:
$("#idformulario")[0].reset();Salu
Editado
1
Puntos
Puntos
20159
Visitas
Visitas
0
Resp
Resp
Por alber hace 86 meses
Administrador