Скрытое текстовое поле

Элемент input со значением type="hidden" создает скрытый элемент, не отображаемый пользователю. Информация, хранящаяся в скрытом поле, всегда пересылается на Web-сервер. Скрытое поле можно использовать, например, в следующем случае. Пользователь заполняет форму и отправляет ее серверу. Сервер посылает пользователю для за­полнения вторую форму, которая частично использует информацию, со­держащуюся в первой форме. Сервер не хранит историю диалога с пользователем, он обрабатывает каждый запрос независимо, и при получении второй формы не будет знать, как она связана с первой. Чтобы повторно не вводить уже введенную информацию, можно заставить программу, обрабатывающую первую форму, переносить необходимые данные в скрытые поля второй формы. Они не будут видимы пользователем и, в то же время, доступны серверу. Вторым случаем использования скрытого поля является передача в форме данных, полученных в результате выполнения сценария документа HTML, например, общей стоимости заказанных товаров в примере 4.5.18.

Имя скрытого поля определяется атрибутом name, а значение – атрибутом value.

Для скрытого поля в интерфейсе HTMLInputElement DOM2 HTML, помимо общих свойств элемента input, определены следующие свойства:

· name – значение атрибута name;

· value – значение атрибута value;

· form (только для чтения) – содержит объект HTMLFormElement формы, к которой принадлежит скрытое поле.

Пример 4.5.27. Использование скрытого поля:

Документ HTML содержит два скрытых поля:

<form id="hiddenForm">

<input type="hidden" id="userName"

name="userData" value="Иванов"/>

<input type="hidden" id="userPass"

name="userData" value="no pass"/>

</form>

Следующий фрагмент сценария меняет значения этих полей и выводит их на экран:

// Получение имени пользователя

// в первом скрытом поле формы

userName = document.getElementById("userName").value;

// Получение пароля пользователя

// во втором скрытом поле формы

userPassword = document.getElementById("userPass").value;

// Задание нового пароля пользователя

// во втором скрытом поле формы

document.getElementById("userPass").value = "stud2";

// Вывод имени, а также старого и нового пароля

alert("Имя: '" + userName + "'" +

"\nПароль: '" + userPassword + "'" +

"\n\nНовый пароль: '" +

document.getElementById("userPass").value + "'");

Вывод Web-страницы будет иметь следующий вид: