Bu bölümde HTML <input> öğesinin farklı form* niteliklerini anlatmaya çalışacağız.
form Niteliği
input form özelliği <input> ögesinin ait olduğu formu belirtmek için kullanılır.
Bu niteliğin değeri ait olduğu <form> elemanının id değerine eşit olmalıdır.
HTML formunun dışında bulunan (ancak yine de formun bir parçası olan) bir giriş alanı:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<form action="/sayfa.php" id="form1">
<label for="ad">Ad:</label>
<input type="text" id="ad" name="ad"><br><br>
<input type="submit" value="Gönder">
</form>
<label for="sad">Soyad:</label>
<input type="text" id="sad" name="sad" form="form1">
</body>
</html>
formaction Niteliği
formaction özelliği, form gönderildiğinde girişi işleyecek dosyanın URL’sini belirtir.
Not: Bu nitelik, <form> öğesinin action niteliğini geçersiz kılar.
formaction özelliği şu giriş türleriyle çalışır: gönderim ve resim.
Farklı eylemlere sahip iki gönder düğmesi içeren bir HTML formu:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<form action="/sayfa.php">
<label for="ad">Ad:</label>
<input type="text" id="ad" name="ad"><br><br>
<label for="sad">Soyad:</label>
<input type="text" id="sad" name="sad"><br><br>
<input type="submit" value="Gönder">
<input type="submit" formaction="/sayfa2.php" value="Yöneticiye Gönder">
</form>
</body>
</html>
formenctype Niteliği
formenctype özelliği, form verilerinin gönderildiğinde nasıl kodlanması gerektiğini belirtir (yalnızca method = “post” içeren formlar içindir).
Not: Bu nitelik, <form> öğesinin enctype niteliğini geçersiz kılar.
Aşağıdaki örnekte iki gönder düğmesi olan bir form yer alıyor. Birincisi form verilerini varsayılan kodlamayla gönderir, ikincisi ise “multipart/form-data” olarak kodlanan form verilerini gönderir:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<form action="/sayfa.asp" method="post">
<label for="ad">Ad:</label>
<input type="text" id="ad" name="ad"><br><br>
<input type="submit" value="Gönder">
<input type="submit" formenctype="multipart/form-data"
value="Multipart/form-data İle Gönder">
</form>
</body>
</html>
formmethod Niteliği
formmethod özelliği, form verilerini eylem URL’sine göndermek için kullanılan HTTP yöntemini tanımlar. Not: Bu nitelik, <form> öğesinin yöntem niteliğini geçersiz kılar.
Form verileri, URL değişkenleri (method = “get”) veya bir HTTP post işlemi (method = “post”) olarak gönderilebilir. Bunu daha önceki yazılarımızda anlatmıştık.
“Get” yöntemiyle ilgili notlar:
- Bu yöntem, form verilerini ad/değer çiftleri halinde URL’ye ekler
- Bu yöntem, kullanıcının sonucu yer imlerine eklemek istediği form gönderimleri için kullanışlıdır.
- Bir URL’ye yerleştirebileceğiniz veri miktarının bir sınırı vardır (tarayıcıya göre değişir), bu nedenle tüm form verilerinin doğru şekilde aktarılacağından emin olamazsınız.
- Hassas bilgileri iletmek için asla “get” yöntemini kullanmayın! (şifre veya diğer hassas bilgiler tarayıcının adres çubuğunda görünecektir)
“Post” yöntemiyle ilgili notlar:
- Bu yöntem form verilerini bir HTTP sonrası işlemi olarak gönderir
- “Post” yöntemiyle yapılan form gönderimleri yer imlerine eklenemez
- “Post” yöntemi “get” yöntemine göre daha sağlam ve güvenlidir
- “post” yönteminin boyut sınırlaması yoktur
Aşağıda iki gönder düğmesi olan bir form yer alıyor. İlk buton form verilerini method = “get”, ikinci buton form verilerini method = “post” ile gönderir:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<form action="/sayfa.php" method="get">
<label for="ad">ad:</label>
<input type="text" id="ad" name="ad"><br><br>
<label for="sad">Soyad:</label>
<input type="text" id="sad" name="sad"><br><br>
<input type="submit" value="Get İle Gönder">
<input type="submit" formmethod="post" value="Post İle Gönder">
</form>
</body>
</html>
formtarget Niteliği
formtarget özelliği, form gönderildikten sonra alınan yanıtın nerede görüntüleneceğini belirten bir adı veya anahtar kelimeyi belirtir.
Not: Bu nitelik, <form> öğesinin hedef niteliğini geçersiz kılar.
Farklı hedef pencereleri olan iki gönder düğmesi bulunan bir form örneği:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<form action="/sayfa.php">
<label for="ad">Ad:</label>
<input type="text" id="ad" name="ad"><br><br>
<label for="sad">Soyad:</label>
<input type="text" id="sad" name="sad"><br><br>
<input type="submit" value="Gönder">
<input type="submit" formtarget="_blank" value="Yeni Sekme/Pencere ile Gönder">
</form>
</body>
</html>
formnovalidate Niteliği
formnovalidate özelliği, bir <input> öğesinin gönderildiğinde doğrulanmaması gerektiğini belirtir.
Not: Bu öznitelik, <input> öğesinin novalidate özniteliğini geçersiz kılar.
İki gönder düğmesi olan bir form (doğrulamalı ve doğrulamasız):
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<form action="/sayfa.php">
<label for="email">E-Posta Adresiniz:</label>
<input type="email" id="email" name="email"><br><br>
<input type="submit" value="Gönder">
<input type="submit" formnovalidate="formnovalidate"
value="Doğrulamadan Gönder">
</form>
</body>
</html>
novalidate Niteliği
Novalidate özelliği bir <form> özelliğidir.
Novalidate, mevcut olduğunda tüm form verilerinin gönderildiğinde doğrulanmaması gerektiğini belirtir.
Aşağıdaki örnekte form üzerinden gönderilen verilerin hiç birinin doğrulanmaması gerektiğini göstermektedir. (örneğin input type email olan alanda girilen veri e-postaya doğrulanmayacaktır.)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<form action="/sayfa.php" novalidate>
<label for="email">E-Posta Adresiniz:</label>
<input type="email" id="email" name="email"><br><br>
<input type="submit" value="Gönder">
</form>
</body>
</html>