Ankara Üniversitesi
Nallıhan Meslek Yüksekokulu
Formlar
NB P10 5 W E B T ASAR IM T E ME L L E R I ÖĞR . GÖR . DR . UFUK T ANYE R I
Formlar [1]
<input name="firstname" type="text">
<select name="cars" size="3">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
Formlar [1]
<textarea name="message" style="width:200px; height:600px">
Ürün hakkında yorumlarınızı buraya yazınız
</textarea>
<button type="button" onclick="alert(‘Merhaba!')">Buraya Tıkla!</button>
Formlar [2]
HTML5 Input Türleri:
color date
datetime-local email
month number range search tel time url week
Formlar [2]
Nitelik Tanım
disabled Bir giriş alanının devre dışı bırakılacağını belirtir.
max Bir girdi alanı için maksimum değeri belirtir.
maxlength Bir girdi alanı için maksimum karakter sayısını belirtir.
min Bir girdi alanı için minimum değeri belirtir.
pattern Giriş değerini kontrol etmek için düzenli bir ifade belirtir.
readonly Bir girdi alanının salt okunur olduğunu belirtir (değiştirilemez).
required Bir giriş alanının gerekli olduğunu belirtir (doldurulması gerekir).
size Bir girdi alanının genişliğini (karakter olarak) belirtir
step Bir girdi alanı için yasal sayı aralıklarını belirtir.
value Bir girdi alanının varsayılan değerini belirtir.
Formlar [3]
<form action="/action_page.php" id="form1">
Ad: <input type="text" name="fname"><br>
<input type="submit" value="Submit">
</form>
Soyad: <input type="text" name="lname" form="form1">
NOT: "Soyad" alanı, form öğesinin dışında ancak yine de formun
bir parçasıdır.
Formlar [3]
<form action="/etkilenen_sayfa1.php">
Ad: <input type="text" name="fname"><br>
Soyad: <input type="text" name="lname"><br>
<input type="submit" value="Gönder"><br>
<input type="submit" formaction="/etkilenen_sayfa2.php"
value="Başka Sayfaya Gönder">
</form>
Formlar [3]
<form action="/action_page_binary.asp" method="post">
Ad: <input type="text" name="fname"><br>
<input type="submit" value="Gönder">
<input type="submit" formenctype="multipart/form-data"
value="Submit as Multipart/form-data">
</form>
NOT1: Formenctype özniteliği, gönderildiğinde form verisinin nasıl kodlanacağını belirtir (yalnızca method = "post" olan formlar için).
NOT2: Formenctype özniteliği, type = "submit" ve type = "image" ile kullanılır.