Отправить поля формы внутри дисплея: нет элемента

Question

У меня есть длинная форма, которую я разбил на 6 шагов.Когда форма загружена, все шаги загружены, но виден только первый шаг.Остальные имеют CSS display:none, поэтому они скрыты.Как шаг завершен и подтвержден с помощью Javascript, текущий шаг установлен на display:none, а новый шаг установлен на display:block.На последнем шаге пользователь отправляет форму.Однако, как и ожидалось, только поля в элементе display:block на странице представлены.Все заполненные поля в элементах с display:none игнорируются.

Есть ли способ отправки полей внутри display:none элементов?

Если нет, есть ли другой способ достижениятот же эффект?

Answer 1

Установите вместо них visibility:hidden и position:absolute. Поля не будут отправлены на сервер с display:none, но будут с visibility:hidden. Также переключая «положение» в «абсолютное», вы получите тот же визуальный эффект.

Обновление Эта проблема больше не возникает ни в одном из текущих браузеров (по состоянию на ноябрь 2015 года). Поля отправляются, даже если для отображения установлено значение «нет». Однако «отключенные» поля по-прежнему не будут отправлены.

Answer 2

HTML4, раздел 17.13.2, прямо говорит, что даже скрытые элементы управления, использующие отображение: ни один не может быть действительным для отправки.

https://www.w3.org/TR/html401/interact/forms.html

Так что, если браузер игнорирует отображение: нет, значит, он не полностью поддерживает HTML. Я рекомендую переключиться на настоящий браузер.

Answer 3

Просто чтобы добавить что-то к ответу выше.Если вы хотите использовать slideDown() - непосредственно перед установкой CSS элемента следующим образом:

$('element')
    .css({
        display: 'none'
        position: 'relative',
        visibility: 'visible'
    })
    .slideDown();

И slideDown() будет работать очень хорошо.Вы можете использовать ту же логику для slideUp().