www.ilkaddimlar.

com Təlimçi: Rəşad Əliyev; 050 648 2737

HTML və CSS
Dərs 4:
Formalar

İlk Addımlar tədris portalı rashad@aliev.info

Rəşad Əliyev 050 648 2737
www.ilkaddimlar.com Təlimçi: Rəşad Əliyev; 050 648 2737

Formalar:
 Formalar nə üçün lazımdır. Forma elementləri.
 Formadan məlumat göndərmək üçün istifadə ediləm
metodlar.
 Forma ilə anketlər düzəldərkən cədvəl tiplərinin istifadə
edilməsi.
www.ilkaddimlar.com Təlimçi: Rəşad Əliyev; 050 648 2737

Formalar
<form>

</form>
<form>

</form>
www.ilkaddimlar.com Təlimçi: Rəşad Əliyev; 050 648 2737

FORM elementinin atributları

action http://ilkaddimlar.com/file.php
/cgi-bin/handler.cgi

enctype text/plain
application/x-www-form-urlencoded
multipart/form-data

method POST
GET

<form name="myForm" action="file.php" method="GET"

enctype="text/plain">
www.ilkaddimlar.com Təlimçi: Rəşad Əliyev; 050 648 2737

Formanın elementləri
4 qrupa bölünür

1) Daxil etmə elementləri (text, password, textarea,file)

2) Seçim elementləri (checkbox,radio,select)
3) Düymələr(submit, reset, button,image)
4) Köməkçi (hidden)
www.ilkaddimlar.com Təlimçi: Rəşad Əliyev; 050 648 2737

Formanın elementləri
Daxil etmə elementləri (text, password)

<input type="text" name="login" size="20"

maxlength="25" value="Login">

Login
Login <input type="text" name="login" size="20" maxlength="25">

<input type="password" name="pass" size="20"

maxlength="25" value="Parol">

<input type="submit" value=" Formanı göndər ">

<input type="reset" value=" Formanı təmizlə ">

name və ya(və) id?

www.ilkaddimlar.com Təlimçi: Rəşad Əliyev; 050 648 2737

Formanın elementləri
Seçim elementləri(checkbox,radio)

<input type="checkbox" name="asp" value="yes">ASP<br>

<input type="checkbox" name="js" value="yes" checked>JavaScript<br>
<input type="checkbox" name="php" value="yes">PHP<br>
<input type="checkbox" name="html" value="yes" checked>HTML<br>

<input type="radio" name="subject" value="asp">ASP<br>

<input type="radio" name="subject" value="js">JavaScript<br>
<input type="radio" name="subject" value="php">PHP<br>
<input type="radio" name="subject" value="html" checked>HTML<br>
www.ilkaddimlar.com Təlimçi: Rəşad Əliyev; 050 648 2737

Formanın elementləri
Seçim elementləri(select)

bağlı açıq

<select name="book" size="1">

<option value="asp">ASP</option>
<option value="js">JavaScript</option>
<option value="php">PHP</option>
<option value="html" selected>HTML</option>
...
</select>

size="5" size="8"
www.ilkaddimlar.com Təlimçi: Rəşad Əliyev; 050 648 2737

Formanın elementləri
Daxil etmə elementləri (textarea)

<textarea name="description" cols="30" rows="10"

wrap="off|virtual|physical">nə isə mətn</textarea>

<input type="checkbox" id="book1" >

<label for="book1">ASP </label>
www.ilkaddimlar.com Təlimçi: Rəşad Əliyev; 050 648 2737

Formanın elementləri
Daxiletmə elementləri(file)
Düymələr(submit, reset, button)

<input type="button" name="push" value=" nə isə et ">

<input type="image" name="enter" src="bluehome.gif" width="32" height="32">

<form enctype="multipart/form-data" action="file.php" method="POST" >

<input type="file" name="userfile" size="60">

<input type="hidden" name="uid" value="15263">

www.ilkaddimlar.com Təlimçi: Rəşad Əliyev; 050 648 2737

Formanın elementləri
<input type="text" name="login" value=“Login" disabled><br>
<input type="checkbox" name="asp" value="yes" checked disabled>ASP<br>

...

<input type="radio" name="book" value="php" checked disabled>PHP<br>

<input type="button" name="push" value=" click me " disabled><br>

<input type="text" name="login" value=" Login "

readonly><br>
<textarea name="description" cols="30" rows="10"
readonly>nə isə mətn</textarea>
www.ilkaddimlar.com Təlimçi: Rəşad Əliyev; 050 648 2737

HTML 5
 type="email"
 type="url"
 type="search"

 Placeholder
www.ilkaddimlar.com Təlimçi: Rəşad Əliyev; 050 648 2737

Formanın elementləri
<element tabindex="1">

<fieldset>
<legend>Kitablar</legend>
<input type="checkbox" id="asp">ASP<br>
<input type="checkbox" id="js">JavaScript<br>
<input type="checkbox" id="php">PHP<br>
<input type="checkbox" id="html">HTML<br>
</fieldset>

<element accesskey="q">
 form.html faylında cədvəlləri istifadə etməklə şəkildəki kimi anket
1 düzəldin (Lab_4)
www.ilkaddimlar.com Təlimçi: Rəşad Əliyev; 050 648 2737

Doctype
 HTML5
<!DOCTYPE html>

 HTML 4
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

 Transitional XHTML 1.0

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/ xhtml1-transitional.dtd">

 Strict XHTML 1.0

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN“
"http://www.w3.org/TR/xhtml1/DTD/ xhtml1-strict.dtd">

 XML Declaration
<?xml version="1.0" ?>
www.ilkaddimlar.com Təlimçi: Rəşad Əliyev; 050 648 2737

Nəticə
 Formalar - istifadəçidən məlumatlar almaq üçün istifadə edilən
yeganə vasitədir.