Основы программирования на JavaScript | страница 10




Прежде всего необходимо узнать, как создать объект JavaScript, который ссылается на форму. Любую форму на странице можно указать с помощью конструкции document.forms. Если имеется форма с именем tutform, то к ней можно обратиться следующим образом: document.forms.tutform.

На любые элементы внутри формы (поля ввода, поля выбора, флажки и т.д) можно ссылаться с помощью конструкции elements: document.forms.ИмяФормы.elements. Если на форме имеется поле ввода с именем firstname, то значение этого поля можно вывести следующим образом:


alert('Имя: ' + document.forms.tutform.elements.firstname.value);


Если щелкнуть на этой кнопке, а затем отправить учебную форму, то появится уведомление с тем значением, которое было введено в поле Имя. Как это происходит? Когда форма посылается на сервер, Web-браузер ищет код onsubmit. Если этот код существует, то форма выполняет его перед отправкой:



Теперь, зная, как получить доступ к форме и элементам на этой форме, выполним некоторые основные проверки. Распространенной задачей является проверка, что именно пользователь ввел в поле ввода. Например, надо проверить, что пользователь ввел свое имя.

Как видно из предыдущего фрагмента кода, свойство ".value " объекта формы можно использовать для получения его значения. Это работает для объектов формы любого типа. Попробуем теперь проверить, что пользователь ввел на форме свои имя и фамилию:


function validateForm(){

var form_object = document.forms.tutform;

if(form_object.elements.firstname.value == ''){

alert('Вы должны ввести свое имя!');

return false;

} else if(form_object.elements.lastname.value == ''){

alert('Вы должны ввести свою фамилию!');

return false;

}

return true;

}


Важными моментами, которые необходимо отметить в этой функции, являются строки return false; и return true;. Если функция проверки возвращает значение true, то форма будет отправлена как обычно. Если, однако, функция вернет значение false, то форма отправлена не будет. Необходимо сообщить пользователю, почему форма не была отправлена, поэтому в функцию вставлены уведомления (