HTML formu, kullanıcının web sayfasında veri girmesini sağlar ve bu veriler sunucuya gönderilebilir. HTML formu, form etiketi ile başlatılır ve form etiketi ile sonlandırılır. Ayrıca, action özelliği, formun sunucuya gönderileceği URL’yi belirtir. Veri girişi için, farklı veri türleri için farklı input etiketleri kullanılabilir.
Aşağıdaki örnekte, basit bir HTML formu oluşturmak için form etiketi kullanarak ad, soyad ve e-posta adresi alanları ile bir “Gönder” düğmesi ekleyeceğiz.
<!DOCTYPE html>
<html>
<head>
<title>HTML Form Örneği</title>
</head>
<body>
<form action="/form-gonder" method="post">
<label for="ad">Ad:</label>
<input type="text" id="ad" name="ad"><br><br>
<label for="soyad">Soyad:</label>
<input type="text" id="soyad" name="soyad"><br><br>
<label for="email">E-posta:</label>
<input type="email" id="email" name="email"><br><br>
<input type="submit" value="Gönder">
</form>
</body>
</html>
Yukarıdaki örnekte, form etiketi action özelliği, verilerin gönderileceği URL’yi belirtmek için “/form-gonder” değerini kullanır. method özelliği, verilerin formdan sunucuya nasıl gönderileceğini belirler. method=”post” kullanıldı ve bu, verilerin HTTP isteği gövdesinde gizli bir şekilde gönderileceğini belirtir.
label etiketi, her input etiketi için etiket adlarını tanımlar ve kullanıcının veri girmesini kolaylaştırmak için etiketleri tıklamak suretiyle veri giriş alanlarına odaklanmasını sağlar.
input etiketleri, type özelliği kullanılarak, farklı veri türleri için farklı veri giriş alanları oluşturmak için kullanılabilir. Örneğin, yukarıdaki örnekte type=”text” ve type=”email” kullanılmıştır. name özelliği, gönderilen verinin sunucuda nasıl adlandırılacağını belirtir.
input etiketi kullanılarak, formun gönderilmesini sağlayan bir “Gönder” düğmesi de ekledik.
Bu örnek, sadece bir HTML formunun en basit şeklini göstermektedir. Daha karmaşık formların oluşturulmasında, farklı input türleri, select ve textarea gibi diğer etiketler de kullanılabilir.
Bu uygulamada herhangi bir sorun yaşarsanız aşağıya yorum olarak bırakabilirsiniz. Bunun yanı sıra web sitemizdeki diğer hazır Html programlama örneklerine ulaşmak için bu linke tıklayabilirsiniz.