Şöyle bir formumuz olsun
<form action="" id="form1" name="form1"> Name: <input type="text" name="user" ><br> Password: <input type="password" name="password"><br> Country: <input type="text" name="country"><br> City: <input type="text" name="city"><br> <input type="checkbox"> <input type="radio"> <input type="radio"> <input type="radio"> <input id="buttonreset1" type="button" value="Jquery"> <input id="buttonreset2" type="button" value="Javascript"> <input id="buttonreset3" type="reset" value="Html">
1.Yöntem:
Jquery 'de direk reset() functionu yok.Yani
$("#reset1").click(function() {
$('#form1').reset();
}); şeklinde denersek hata alıyoruz.Ama get() fonksiyonu ile şu şekilde yapabiliyoruz: $("#reset1").click(function() {
$("#form1").get(0).reset();
}); 2.Yöntem: Javascript 'te reset() fonksiyonu bulunduğu için direk bu fonksiyonu kullanarak formdaki elementleri temizleyebiliriz:
$("#reset2").click(function(){
document.getElementById("form1").reset();
});3. Yöntem: Html de <input type="reset"> kodu ile direk formu resetleyen bir button oluşturabiliriz.
Not: Html 5 deki required tagı ile textboxlara boş değer girilmemesini sağlayabiliriz.Bu tag tüm güncel browserlar tarafından desteklenmektedir.
Name: <input type="text" name="user" required><br> Password: <input type="password" name="password" required><br>