Формалар

Тақ ырып. HTML-қ ұ жаттын пішімдеу

Мақ саты: HTML-тілінде формалар қ ұ ру, HTML-қ ұ жатын фреймдік негізде қ ұ руды, гиперсілтемелерді суретке жә не мә тінге қ олдана білуді, кө лденең сызық тарды Web-парағ ына қ одануды жә не сырғ ымалы жолдарды ұ йымдастыруды, сү згілеуді Web-парағ ындағ ы мә тінге жә не суретке қ олдануды оқ ып ү йрену.

Оқ ытудың міндеттері:

Студенттердің форма, фрейм, кө лденең сызық, гипермә тіндік сілтеме, мә тінге жә не суретке қ олданылатын сү згі қ ұ рудағ ы дағ дыларын жә не қ абілеттіліктерін қ алыптастыру.

Йымдастыру кезең і: -5 мин

Студенттердің сабақ қ а қ атысуын тексеріп, келмеген жә не дайындалмағ ан себептерін айқ ындап, жаң а сабақ қ а назар аударуын ұ йымдастыру.

Қ ұ зыреттілікті қ алыптастыру саны: біліктілік, практикалық дағ ды.

Тақ ырыптың негізгі сұ рақ тары: -45 мин

Тақ ырып бойынша негізгі сұ рақ тар:

1. HTML –тілінде Web-парағ ын қ ұ ру.

2. Форманың анық тамасы жә не атрибуттары.

3. < FORM> тэгінің атрибуттары жә не олардың қ олданылуы.

4. ACTION, METHOD жә не ENCTYPE атрибуттарының қ ызметі.

5. < INPUT> элементінің негізгі типтері.

6. Фрейм тү сінігі, оның қ ұ рылымы мен мү мкіндіктері.

7. Фрейм қ ұ ру ережесі.

8. Браузер қ ұ жаттарын кө лденең жә не тігінен орналастыру ү шін фреймнің қ андай атрибуттары

қ олданылады?

9. Бір қ ұ жаттан екінші қ ұ жатқ а ө ту ережелері.

10. Кө лдең ен сызық тарды қ оюғ а арналғ ан тэг жә не оның атрибуттары.

11. Мә тінге жә не суретке қ олданылатын сү згілеулер.

Ы С Қ А Ш А Т Е О Р И Я С Ы

Формалар

Форма — HTML-қ ұ жатындағ ы ақ паратты Web-сервер арқ ылы ә лемнің алдын ала белгіленген бір жеріне жіберу ү шін қ олданылатын қ ұ рал. Формалар арқ ылы сайтқ а кірушілерге сұ рақ нама қ ұ руғ а, жарнама жасауғ а жә не медициналық анық тамалар қ ұ руғ а болады.

Форманың жұ мыс істеу принципі мынадай: сайтқ а кіруші форманы толтырады, толтырып болғ аннан кейін белгілі бір батырманы басып, формадағ ы ақ парат кө рсетілген жерлерге барады. Формалар < FORM>... < /FORM> тэгтер арасында орналасады. HTML-қ ұ жатының ішінде бірнеше форма болуы мү мкін, бірақ, олар бірінің ішінде бірі орналаспауы керек. < FORM> тэгінің негізгі атрибуттары:

Қ олданушы формағ а ақ паратты енгізу ү шін < INPUT> элементін қ олданады. Ә рбір < INPUT> элментінде NAME=имя атрибуты бар, ол жолдың атын анық тайды (жолдың идентификаторы). Келесі кестеде < INPUT> элементінің басты типтері кө рсетілген:

Атрибут	Атқ аратын қ ызметі
TYPE=text	Мә тін енгізетін ұ яшық ты анық тайды. Қ осымша мынадай атрибуттары бар: SIZE=сан (ұ яшық тың ені символмен беріледі) жә не MAXLENGTH=сан (Ө ріске жазлатын символдардың мү мкін максималды саны): < INPUT TYPE=text SIZE=20 NAME=User VALUE=" Алмас" > Ені 20 символдан аспайтын мә тін енгізуге арналғ ан ұ яшық ты анық тайды. Автоматты тү рде ұ яшық та “Алмас” сө зі шығ ады, оны қ олданушы ө з қ алауынша ө згерте алады.
TYPE=password	Пароль енгізетін ұ яшық ты анық тайды. Тext типіне ө те ұ қ сас, бірақ, мә тіннің орнына жұ лдызшалар (*) шығ ады: < INPUT TYPE=password NAME=PW SIZE=20 MAXLENGTH=10> Еніне 20 символ сиятындай пароль енгізу ұ яшығ ын шығ арады. Кө рсетілген ү лгіде парольды 10 символғ а дейін енгізуге болады.
TYPE=radio	Радиобатырманы экранғ а шығ арады. CHECKED (радиобатырманың ерекшеленгенін) деген қ осымша атрибуты болады. Аттары бірдей бір топ радиобатырмалардың ішінде тек біреуі ғ ана белгіленген радиобатырма болады: < INPUT TYPE=radio NAME=Question VALUE=" Yes" CHECKED> Иә < INPUT TYPE=radio NAME=Question VALUE=" No" > Жоқ < INPUT TYPE=radio NAME=Question VALUE=" Possible" > Мү мкін Радиобатырманы ерекшелеп алғ ан соң осы ақ парат тұ тынушығ а жіберіледі. Егер радиобатырманы ерекшелемесе Question айнымалысына Yes мә ні беріледі: Question=Yes.
TYPE=checkbox	Белгі қ оюғ а болатын квадрат батырмаларды анық тайды жә не CHECKED деген қ осымша атрибуты бар. (квадратқ а белгі қ ойып кө рсетеді). Радиобатырмалардан айырмашылығ ы - аттары бірдей квадраттар тобында бірнеше квадраттар белгіленуі мү мкін: < INPUT TYPE=checkbox NAME=Comp VALUE=" CPU" > Процессорлар < INPUT TYPE=checkbox NAME=Comp VALUE=" Video" CHECKED> Видеоадаптерлар < INPUT TYPE=checkbox NAME=Comp VALUE=" Scan" > Сканерлер < INPUT TYPE=checkbox NAME=Comp VALUE=" Modem" CHECKED> Модемдер Квадрат батырмалардың бірнешеуі белгіленгеннен соң, осы ақ парат тұ тынушығ а жіберіледі. Егер белгіленбесе, келесідей екі айнымалы жіберіледі: Comp=Video жә не Comp=Modem.
TYPE=submit	Формадағ ы мә ліметті тұ тынушығ а жіберетін батырманы шығ арады. Ол ә рекет " Жіберу" батырмасын басқ анда жү зеге асады: < INPUT TYPE=submit VALUE=" Жіберу" >
TYPE=reset	Формадағ ы жолдарды тазалайтын батырманы анық тайды. Ол ә рекет батырма басу арқ ылы орындалады. " Тазарту" батырмасы басылғ ан соң формадағ ы мә лімет ө ң деушіге жіберілмейді:

Формада кө лемді мә тіндер енгізуге арналғ ан ұ яшық орнатуғ а болады. Ол < TEXTAREA> элементі арқ ылы орындалады:

< TEXTAREA NAME=address ROWS=5 COLS=50> Ө зің із туралы мә лімет енгізің із < /TEXTAREA>

NAME атрибуты ұ яшық қ а енгізілген мә тінге ат меншіктейді, сол атпен ол тұ тынушығ а жіберіледі. ROWS атрибуты ұ яшық тың биіктігін мә тін жолдарымен анық тайды. COLS атрибуты ұ яшық тың енін символдармен анық тайды. < TEXTAREA>...< /TEXTAREA> тэгтерінің арасындағ ы мә тін, қ алыпты жағ дайда осы ұ яшық тың ішінде орналасады. Қ олданушы оны ө згерте немесе мү лде ө шіре алады. Бұ дан басқ а формада тағ ы таң дау менюін қ олдануғ а болады. Ол < SELECT> ашылатын тэгімен басталып (менюғ а ат беретін NAME міндетті атрибуты бар,) жә не < /SELECT> жабылатын тэгімен аяқ талады. Олардың арасында меню элементін анық тайтын < OPTION> тэгі орналасады. Егер осы элемент таң далса, міндетті VALUE атрибуты тұ тынушығ а жіберілетін мә ндер қ ояды. < OPTION> тэгінде selected атрибутын қ олдануғ а болады, ол қ алыпты жағ дайда қ ай элемент таң далып тұ рғ анын кө рсетеді.

< SELECT NAME=" Аты" > < OPTION VALUE=" option_1" selected> 1-ші мә тін < OPTION VALUE=" option_2" > 2-ші мә тін < OPTION VALUE=" option_n" > n-ші мә тін < /SELECT>

< SELECT> тэгінде MULTIPLE атрибутын қ олдануғ а болады, ол меню ішінен бірнеше элементті таң дап алуғ а болатынын кө рсетеді. Кө п жағ дайда < SELECT MULTIPLE> элементін бү тін ұ яшық ретінде шығ арып кө рсетеді. Ол ұ яшық тың ішіне менюдің барлық элементтері сияды. Ұ яшық тың жол санын анық тау ү шін SIZE= “сан” атрибуты қ олданылады.

< SELECT MULTIPLE SIZE= “2” NAME=" Аты" > < OPTION VALUE=" option_1" selected> 1-ші мә тін < OPTION VALUE=" option_2" > 2-ші мә тін < OPTION VALUE=" option_n" > n-ші мә тін < /SELECT>

Мысал 1:

< HTML>

< HEAD>

< TITLE>

ПРИМЕР

< /TITLE>

< /HEAD>

< Body BGCOLOR=" RED" FORM METHOD=" POST" ACTION=" сіздің _t-mail_адресің із" >

< H1 align=" center" > < I> “Жұ мысқ а тұ ру” анкетасы< /I> < /H1>

< p>

< H2> Аты-жө ні: < /H2>

< INPUT TYPE=" TEXT" NAME=" Аты" SIZE=" 30" >

< H2> Мекен-жайы: < /H2>

< INPUT TYPE=" TEXT" NAME=" Мекен-жайы" SIZE=" 30" >

< H2> Телефоны: < /H2>

< INPUT TYPE=" TEXT" NAME=" Телефон" SIZE=" 10" > < BR>

< H2> Жынысы: < /H2>

< INPUT TYPE=" RADIO" NAME=" Таң дау 1" VALUE=" Ер бала " > Ер бала< BR>

< INPUT TYPE=" RADIO" NAME=" Таң дау 1" VALUE=" Қ ыз бала " > Қ ыз бала

< /FORM>

< /HTML>