Програмиране в Интернет - теория - 10/10

13) JAVASCRIPT И ФОРМИ

1. Какво представлява обектът за форма.
Всяка двойка тагове <FORM> и </FORM> в HTML документ създава елемент в масива forms в реда, в който се появяват в документа. Достъп до първата форма в документа става чрез document.forms[0] (номерирането започва както при всички масиви от 0).
Другият начин за достъп до форма става чрез името й, зададено в отварящия таг <FORM> по следния начин: document.ime_na_forma
Използват се две свойства length:
- document.forms[x].length – намира броя елементи на формата с индекс х;
- document.forms.length – намира броя форми в страницата.
2. Някои свойства на обекта Forms.
- length – Свойството е обяснено по-горе.
- action – Стойността на атрибута action в FORM тага.
- method – Стойността на атрибута method в FORM тага.
- name – Стойността на атрибута name в FORM тага.
- target – Стойността на атрибута target в FORM тага.
- elements – Масив, включващ елементи за всеки елемент (текстово поле, радиобутон и др.) от една HTML форма. Достъпът до всеки елемент на форма става с посочване на индекса на елемента (document.ime_na_forma.element[0]). Освен по този начин, до елемент от формата достъп може да има и чрез името му, зададено в съответния таг (document.ime_na_forma.ime_na_element).
Всеки елемент на форма има собствени свойства и методи.

== checked – Свойството има стойност true, ако полето или бутонът е избран и стойност false, ако не е.
== defaultChecked – Свойството има стойност true, ако полето за отметка или радиобутонът имат атрибут checked (т. е. зададено е избиране на съответното поле или бутон по подразбиране) и стойност false, ако нямат.
== defaultValue – Съдържа подразбиращата се стойност, която е зададена в атрибута value на тага на елемента във формата.
== form – Това свойство се използва често с ключовата дума this за обръщане към формата, съдържаща елемента.
Напр. ако във форма с име info_form искаме в текстовото поле с име favurl да променим стойността, това може вместо с document.info_form.favurl.value= "http://www.yahoo.com" да стане с по-краткото this.info_form.favurl.value= "http://www.yahoo.com".
== name – Съдържа стойността на атрибута name на дадения елемент.
== options (масив) – Свойството е масив, който съдържа елемент за всяка опция, изброена в поле за избор във формата. Индексните номера започват от 0, а всяка опция се поставя в масива в реда, в който е записана в HTML кода.
== selectIndex – Съдържа индексния номер на опцията (в масива options), която е избрана от потребителя. Ако е избрана първата опция, стойността е 0, ако е избрана втората – стойността е 1 и т. н.
== type – Съдържа стойността на атрибута type на дадения елемент от формата.
== value – Съдържа текущата стойност на елемента
== blur() – Метод за премахване на фокуса от елемента
== click() – Методът позволява в кода да се създаде събитие за щракване върху бутон.
== focus() – За придаване на фокус на даден елемент на формата.
== select() – Методът позволява да се избере автоматично съдържанието на текстово поле или текстова област. Полезно, ако сме задали стойност по подразбиране и искаме потребителят да може да изтрие бързо тази стойност.
3. Някои методи на обекта Forms.
- reset() – Връща формата в начално състояние
- submit() – Изпраща формата без потребителят да щрака върху бутона submit.
4. Валидизиране на форми с JavaScript.
Валидизирането на форми само с JavaScript не винаги е разумно, тъй като потребителят може да е дезактивирал JavaScript в браузъра си. Но все пак валидизирането преди пращането към някакъв сървърен скрипт може да спести време и да намали натоварването на сървъра.
Когато потребителят щракне върху бутона submit, възниква събитие за изпращане, което може да се прихване от функцията onSubmit в отварящия таг <FORM>. Там може да се извика функция, която да изпълни проверка за валидност на данните. За да свърши работата си функцията, трябва, ако данните не минат валидирането да не се изпратят данните. За да стане това във функцията за обработка на събития onSubmit трябва да се постави return. Подразбиращото се действие (изпращането) ще се осъществи, ако се получи onSubmit=" return true" и няма да се изпълни при onSubmit=" return false".

Разбира се, тук проверката е опростена и например имейлът a@a.a ще мине валидацията, макар да не е валиден.

<< Предходна