tengo un formulario el cual es muy extenso ya que son muchos campos a llenar y son obligatorios. Todos los muestro en una modal pero hay otros datos a llenar y estos son opcionales y no los quiero mostrar a menos que el usuario o administrador quiera verla. Quería saber si hay un método para eso, de darle a siguiente o marcar una casilla, presionar un botón, lo que sea, de forma que despliegue el resto del formulario a llenar y al final guarde los datos
1 respuesta
Puedes ocultar los formularios opcionales con css y mostrarlos con js cuando un checkbox esta marcado.
Ejemplo:
<form>
<input type="email" placeholder="email" />
<br>
<input type="password" placeholder="password" />
<br>
<label>Mostrar</label>
<input type="checkbox" onchange='show(this)' />
<br>
<input type="text" placeholder="otro" class="hide" style="display:none;">
<input type="xd" placeholder="otro" class="hide" style="display:none;">
<input type="submit" value="enviar" />
</form>
<script>
function show(bool) {
var formset;
if (bool.checked == true) formset = "block";
else formset = "none";
var elements = document.querySelectorAll(".hide");
elements.forEach(function(name, index) {
elements[index].style.display = formset;
});
}
</script>
Codigo editado
-
-
Olvide que con la id solo se podría con un elemento, asi que edite el codigo, a cualquier input que le pongas class="hide", se ocultara y mostrara solo cuando el checbox este activo Commented el 2 jun. 2020 a las 6:26
-
1
-
No, solo en las mismas etiquetas para ocultarlas Commented el 2 jun. 2020 a las 6:33