Tengo un formulario largo que he dividido en 6 pasos. Cuando se carga el formulario, se cargan todos los pasos, pero solo el primer paso es visible. El resto tiene CSS de display:nonepor lo que están ocultos. Cuando un paso se completa y valida con Javascript, el paso actual se establece en display:noney el nuevo paso se establece en display:block. En el paso final, el usuario envía el formulario. Sin embargo, como se esperaba, solo display:blockse envían los campos del elemento en la página. display:noneSe ignoran todos los campos completados en los elementos con .
¿Hay alguna forma de enviar los campos dentro de los display:noneelementos?
Si no es así, ¿hay otra forma de lograr el mismo efecto?
javascript
css
forms
Nick Petrie
fuente
fuente
display: nonecontenedores en todas mis pruebas.Respuestas:
Configúrelos en
visibility:hiddeny en suposition:absolutelugar. Los campos no se enviarán al servidor condisplay:none, sino que estarán convisibility:hidden. Al alternar también "posición" a "absoluta" debería obtener el mismo efecto visual.Actualización Esto ya no parece ser un problema en ningún navegador actual (a partir de noviembre de 2015). Los campos se envían incluso si la visualización está configurada como "ninguna". Sin embargo, los campos que están 'deshabilitados' seguirán sin enviarse.
fuente
display:none;. El mismo problema ocurre si el campo tiene otro elemento HTML encima.disabledevita que se envíen valores, pero en algunos navegadores más antiguos,display:nonetambién tendría este efecto. Tenga en cuenta que esta respuesta se publicó hace 4 años y solo se aplica a los desarrolladores que necesitan desarrollar para esos navegadores más antiguos.El HTML4, sección 17.13.2, dice explícitamente que incluso los controles ocultos que usan la pantalla: ninguno puede ser válido para el envío.
https://www.w3.org/TR/html401/interact/forms.html
Entonces, si el navegador ignora display: none, entonces no es completamente compatible con HTML. Recomiendo cambiar a un navegador real.
fuente