Submit
Обмен данными
Передача данных на сервер из формы происходит по событию submit. Это событие происходит при одном из следующих действий пользователя:
При описании отображения контейнера FORM на объекты JavaScript мы подробно описали обработку события submit. В данном разделе мы сосредоточимся на сочетании JavaScript-программ в атрибутах полей и обработчиках событий. Особое внимание уделим возможности перехвата/генерации события submit.
Кнопка Submit
Кнопка submit - это разновидность поля ввода. Она ведет себя так же, как и обычная кнопка, но только при этом генерирует событие submit(передачу данных на сервер). В этом, с точки зрения JavaScript-программирования, она абсолютно идентична графическим кнопкам:
<form>
<input type=submit value=submit>>
</form>
В этом примере мы просто перезагружаем страницу.
С точки зрения программирования наибольший интерес представляет собой возможность перехвата события submit и выполнение при этом действий, отличных от стандартных. Для этой цели у кнопки есть атрибут обработки события click(onClick):
<form>
<input type=submit value=Submit onClick="return false;">
</form>
Из этого примера видно, что кнопка submit ведет себя несколько иначе, чем графическая кнопка в Netscape Navigator, но также как графическая кнопка в Internet Explorer(различия со временем наверняка исчезнут :-)). При нажатии на кнопку перезагрузки страницы не происходит - передача данных на сервер отменена. Обработчик работает так же, как и обработчик события submit в контейнере FORM.
Теперь можно написать свою собственную программу обработки события submit:
function my_submit()
{
if(window.confirm("Do you wona to reload page?")) return true;
else return false;
}
...
<form>
<input type=submit value=Submit onClick="return my_submit();">
</form>
Если согласиться с перезагрузкой страницы, то она действительно будет перезагружена, при отказе (cancel) - вы вернетесь в текущую страницу без перезагрузки. Действия могут быть и более сложными. В любом случае, если функция обработки возвращает значение true, то передача данных на сервер(в нашем случае перезагрузка страницы) происходит, в противном случае (значение false) - данные не передаются.
начало страницы
Единственное поле в форме
Если в форме присутствует одно единственное поле, и мы в него осуществили ввод и после этого нажали на кнопку клавиатуры Enter, то браузер сгенерирует событие submit:
<form onSubmit="window.alert('Data submited');return false;">
<input size=10 maxlength=10>
</form>
Перехватить такое событие и обработать можно только за счет программы обработки события submit в контейнере FORM, как это и сделано в примере.
Нужно что-то делать
Ничего не надо делать
В этом примере кроме поля ввода в форме присутствует меню. Если менять значения выбранных альтернатив, то перезагрузки не происходит, но стоит изменить значение в поле ввода и нажать Enter, происходит submit и мы получаем окно предупреждения.
начало страницы
Метод submit()
Метод submit() - это метод формы. Если в программе вызывается метод submit, то данные из формы, к которой применяется данный метод, передаются на сервер. Усовершенствуем пример с полем ввода и меню выбора(прежде чем выбирать альтернативы прочтите комментарий под примером):
<form onSubmit="window.alert('Data submited');return false;">
<input size=10 maxlength=10>
<select onChange="form.submit();">
<option>Нужно что-то делать<option>Ничего не надо делать</select>
</form>
Нужно что-то делатьНичего не надо делать
При выборе альтернативы пользователь сразу инициирует обмен данными с сервером. Событие submit в данном случае обработчиком событий не перехватывается в отличие от нажатия Enter. Такое поведение браузера довольно логично. Если программист вызвал метод submit(), то, наверное, он предварительно проверил данные, которые отправляет на сервер.
