myNotlar Logo

onSubmit Olayı (Event)


JavaScript onSubmit olayı (event), kullanıcı sayfadaki bir formu gönderdiği zaman gerçekleşir (Tarayıcı formu göndermeden önce tetiklenir.). HTML onSubmit özelliği form gönderilmeden önce çalıştırılacak fonksiyonun veya betiğin (script) belirtilmesini sağlar.

HTML dahilindeki sadece tek bir fonksiyon belirtilebilen bu tip olay yönetim fonksiyonlarına olay tutucu (event handler) ismi verilir. Fakat, HTML DOM'da birden fazla olay yönetim fonksiyonu belirtilebildiği için olay tutucusu isminden ziyade olay dinleyici (event listener) ismi kullanılmaktadır. DOM'da olay dinleyici fonksiyonlar attachEvent ve addEventListener fonksiyonları ile ilgili elemente eklenebilir/bağlanabilir.

HTML Sözdizimi

<element onsubmit="betik" > ... </element>

DOM Sözdizimi

element.onsubmit = fonkBetik;

betik = element.onsubmit
betikonsubmit olayı tetiklendiğinde çalıştırılacak betik (script) kodlarını belirtir.
fonkBetikonsubmit olayı tetiklendiğinde çalıştırılacak fonksiyon adını veya betik kodlarını belirtir.

Dönüş Değeri

betikFonksiyon belirtildiyse fonksiyon gövdesi veya betik kodları döner.

Örnek

Aşağıdaki örnek, JavaScript onSubmit olay tutucu kullanarak form gönderilmeden önce bilgi girişi yapılıp-yapılmadığının nasıl kontrol edileceğini ve eğer giriş yapılmadıysa nasıl iptal edileceğini göstermektedir.

<html>
<head>
<script type="text/javascript">
function HataliGiris()
{
    document.getElementById('uyari').innerHTML = "Lütfen girişleri kontrol ediniz!";
}
function Kontrol()
{
    if((document.SifreForm.KulText.value == "") ||
        (document.SifreForm.SifText.value == ""))
    { 
        HataliGiris(); // Uyarıyı göster.
        return false; // Form gönderilmez.
    }
    else
    {        
        return true; // Form gönderilir.
    }
}
</script>
</head>
<body>
<form name="SifreForm" method="post" onSubmit="return(Kontrol());">
<div style="background-color:#f0f0f0; border: solid 1px #d0d0d0;">
<table style="font-size:10pt;">
    <tr><td>Kullanıcı Adı</td>
        <td>: <input id="KulText" type="text" value="" ></td>
        <td><span id="KulUyar" style="color:red;"></span></td>
        </tr>
    <tr><td>Şifre</td>
        <td>: <input id="SifText" type="text" value="" ></td>
        <td><span id="SifUyar" style="color:red;"></span></td>
        </tr>
    <tr>
        <td colspan="2" align="right"><input type="submit" value="Gönder"></td>
        </tr>
    <tr>
        <td colspan="3"><span id="uyari" style="color:red;"> </span></td>
        </tr>
</table></div>
</form>
</body>
</html>

Elementler

submit olayının gerçekleşebileceği/kontrol edilebileceği HTML etiketleri/elementleri

FORM

İlgili Başlıklar
 
myNotlar Hakkında
Telif Hakkı © 2007-2009 mynotlar.com Tüm Hakları Saklıdır. Kopyalanamaz. Yayınlanamaz.
E-Posta : support@myNotlar.com

| Tek Kişilik Oyunlar | Sudoku | Oyunlar |