Сайтқа ену

Оқулықтар

Интернетке орналастыру

Оқулық-бағдарламалар

DDD

Html формасы деген не және ол неге керек.

Html формсы шамасы html тілінің ең күрделі бөлігі болар. Осы турасында айтып көреміз.

html формасы деген не? Төменге қараңыз, html формасының оқыту дискісінің тапсырысы берілген. Оқыту аяқталған соң, сізде оны жасай алатын боласызкую.

Енгізіңіз ФИО:


Енгізіңіз пароль:


Қай дискіні алғыңыз келеді?

CD
DVD

Дискіде қандай оқыту курсын көргіңіз келеді?

Фотошоп курсы
Adobe Dreamweaver курсы
PHP бойынша курстар

Жеткізу тәсілін таңдаңыз:




Жеткізу адресін енгізіңіз:

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

Көрдіңіз ғой? Қазір барлық жерде осылай, енді осыны талдап көрейік:

html формасы- html арқылы құрылған жай каркас қана. Онда біз браузерге қандай өріс бар, онда не жазылған, қандай тетіктер қойылғаны туралы көрсете аламыз. Бірақ кнопканы басқан кезде сіздің түсіндірмеңіз қонақ кітабына қосылу үшін немесе тапсырыстар офиске жету үшін - басқа технология – программа, формаға тіркелетін скрипт керек. Әдетте мұндай программа php бағдарламасында берілген. Біз жаттығу үшін жай өңдеушін туралы айтамыз. Күрделіні интернеттен табуға болады немесе өзіңіз жазуға болады.

Форманың барлық элементтерін ретімен айтып көрейік:

Форманың кезкелген элементі форма бойында тұрады, кезкелген форманың каркасы бар. Ал оның ішіне фоманың әртүрлі элементтері қойылады, және html код жазылады.

Мысал 1:

<form>
<!—осы жерге әртүрлі элементтер қойылады -->
</form>

Мұнда екі базалық тег бар: ашылмалы <form> және міндетті жабылмалы тег </form> .

Бұл жай каркас, атрибуттары жоқ. Енді html формасының нақты каркасын қарастырамыз:

Мысал 2:

<form name="forma zakaza" method="post" action="obrabotchik.php">
<!—осы жерге әртүрлі элементтер қойылады -->
</form>

Атрибуттер:

NAME – форма атын анықтайды, құжат үшін бірегей. Егер құжатта бірнеше форма қатысатын болса ғана қолданылады.

ACTION – міндетті атрибут. Скриптке ( немесе бағдарламаға) серверге жолды көрсетеді, ол осы формаға қызмет етеді.

METHOD – html формасының ішіндегіні жөнелту әдісін анықтайды. Мүмкін мәндері GET (әдепкіде) және POST.

Беру әдісі туралы бірер сөз:

GET әдісі әртүрлі айнымалыларды беру үшін қолданылады, немесе өте қысқа хабарларды. Ақпарат браузер жолы арқылы айқын түрде беріледі , яғни оны қстар алуға болады. Мысалы, егер браузер жолында мынадайды көрсеңіз http://adress.com/lessons.php?rub=28 бұл дегеніміз это значит что передается значение переменной rub айнымалыға 28 ге тең мән берілді деген сөз. html формаларда әдетте қолданылмайды.
POST әдісі мәтіндік хабарларды беру үшін арнайы құрылды. Формаларда әрқашан қолданылады. Ақпаратты жасырын түрде береді.

Әзірге бәрі түсінікті болса, онда форма элементін талдауды бастайық:

<form name="primer1" method="post" action="obrabotchik.php">
Енгізіңіз ФИО: <br>
<input type="text" name="fio" size="30">
<br>
Енгізіңіз пароль:<br>
<input type="password" name ="pass">
</form>

Нәтижесінде аламыз:

Енгізіңіз ФИО:


Енгізіңіз пароль:

Бастапқы кодта нені байқаймыз. Одан мынаны байқаймыз:

INPUT элементіформаның html өрісін құрады (кнопка, ендіру өрісі, чекбокс тағы басқалар.), Элементте жабатын тег жоқ.

Негізгі атрибуттер:

TYPEдеректерді енгізу үшін өріс типін анықтайды. Әдепкідебұл "text". Бұл мысалда "password" типі қолданылады, ол ақпараттың жұлдызшамен көрсетілуін нұсқайды.

NAME – берілім кезіндегі қолданылатын атауды анықтайды, html форманығ серверге берілу мазмұнын. Егер Сіз формадан ақпаратты бір жаққа жібергіңіз келсе, онда міндетті түрде атау енгізіңіз.

SIZE – символды өріс өлшемін анықтайды. Әдепкі мәні тең 24. яғни бұл атрибуттың жазбаған кездегі ұзындығы тең 24 символға.

Тағы да сондай пайдалы MAXLENGTH сияқты атрибут бар, ол символдардың ең үлкен санын анықтайды, оны мәтіндік өріске енгізуге болады. Ол символдар санынан үлкен болуы мүмкін, SIZE атрибутінде көрсетілген. Әдепкі символдар саны шексіз.

Мына мысалды қарайық:

<form name="primer2" method="post" action="obrabotchik.php">
Енгізіңіз пароль (ең үлкені алты символ):<br>
<input type="password" name ="pass" maxlength="6">
</form>

Нәтиже:

Енгізіңіз пароль (ең үлкені алты символ):

Қалай жұмыс істей ме? Алтыдан артық символ енгізіп көріңіз.

Тағы да VALUE атрибуты бар, ол енгізу үшін әдепкіде өріске не жазылғанын анықтайды.

Мысалға қараңыз:

<form name="primer3" method="post" action="obrabotchik.php">
Введите свой e-mail: <br>
<input type="text" name="e-mail" size="35" value="
пример: admin@zvirec.com">
</form>

Нәтижесі:

Өз е-mail енгізіңіз:



Енді форманың мынадай элементін енгізіңіз:

<form name="primer4" method="post" action="obrabotchik.php">
<p>
Флешканың қандай түрін алғыңыз келеді?</p>
<p>
<input name="disc" type="radio" value="f8" checked>
f8<br>
<input name="disc" type="radio" value="f16">
f16 </p></form>

Нәтижесі:

Флешканың қандай түрін алғыңыз келеді?

8 гбайт
16 гбайт

Бұл форманың html элементтер типі формы называется радиоқосқыш деп аталады (қосады: не бір мәнді, не басқаныекеуін бірмезетте мүмкін емес). Сондықтан type атрибутының мәні type="radio". Біз флешка8 және флешка16 бірін алады екенбіз, онда радиоқосқыш бізде екеу, сондықтан екі рет INPUT элементін пайдалануымыз керек. Өзіңіз көріп тұрғандай олардың аттары бірдей - name="disc" және и value мәндері әртүрлі. Неге солай? Ойластырып көрейік:

Бізге керегі клиенттің қандай флешка алатындығы, флешка8 немесе флешка16 . Сондықтан бізде атау мәні бірдей name="disc" және әртүрлі мәндер ( value="f8" и value="f16"). Егер біз бірінші үлгіні таңдасақ, онда айнымалы disc қабылдайды f8 мәнін, егер екінші болса- онда f16. Басқадай болмайды.

Егер Сіздің радиоқосқышыңыз бір үлгіде қосылған болса, онда checked (қосылған) қосып жазыңыз.

Ескерту: радиоқосқышта міндетті түрде value мәні қатысуға тиісті, олай болмаса жұмыс істемейді.


Соңғы
элемент:

<form name="primer5" method="post" action="obrabotchik.php">
<p>
Флешкамен қандай оқулық түрін алғыңыз келеді?</p>
<input type="checkbox" name="fotoshop" value="yes" checked>
Фотошоп курсы бойынша <br>
<input type="checkbox" name="dreamweaver" value="yes">
FrontPage
курсы бойынша <br>
<input type="checkbox" name="php" value="yes"> HTML
курсы бойынша
</form>

Результат:

Какие обучающие курсы вы хотите видить на диске?

Фотошоп курсы бойынша
FrontPage курсы бойынша
HTML курсы бойынша

html формасының бұл элементтері checkbox деп аталады және радиоқосқыштан айырмашылығы мұнда бірнеше үлгіні таңдауға болады. Мұндағы type="checkbox" элемент типін білдіреді - Чекбокс, атрибут name атрибуты өңдеуші берілген өрісті айқындауға қажет және и ақырында value мәні жалауша қою кезінде жіберілуге тиісті параметрді анықтайды.

Бұл элементе value атрибут мәні міндетті емес, радиоқосқыштан айырмашылығ. Егер біз оны қоймасақ, онда жалуша қою кезінде, өңдеушіге айнымалы мәні ретінде жалауша жанындағы мәтін де бірге кетеді.

Қараңыз

Келесі - Формамен жұмысты аяқтау
Алдыңғы – html кестелерді талдау

Сайт бойынша іздеу

Мазмұны

Copyright © 2015 Матаев Саркытбек | Интернеттік бағдарламалар мен математика жетістіктерін жариялауға арналған сайт – www.karakoz.kz