checkbox ve radio düğmeleri
Checkbox ve radio düğmeleri formlar içerisinde kullandığımız diğer elemanlardır. Bu elemanların sonuçları bir index içerisinde tutulurlar. Fakat bu sonuçlar value değerleri değildir. Çünkü bu elemanların value değerleri sabit bir yapıdadır. Sonuçları ise işaretli(true), işaretsiz(false) olarak elde edilir. Bir formun içerisindeki eleman sayısını tespit edebiliriz. Bunun için lenght metodunu kullanıyoruz. document.formAdi.lenght şeklinde bir kullanım formun içerisindeki eleman sayısını verecektir.
Yine bir checkbox veya radio elemanının indexi document.formAdi.radioAdi.lenght şeklinde bulunabilir. Böylece kaç adet radio düğmesi veya checkbox kullanıldığı bulunabilir. Yine bu index sayesinde her radio veya checkbox elemanının değeri(true/false) bulunabilir.
Mesela üç checkbox elemanından bir form oluşturalım.
<form name=deneme>
<input type=checkbox name=isim value=ahmet>
<input type=checkbox name=isim value=mehmet>
<input type=checkbox name=isim value=hasan>
</form>
deneme adlı bu formun içerisinde isim adlı bir checkbox gurubu bulunuyor. Bu gurup içerisinde ise 3 eleman bulunmaktadır. Biz form içerisindeki bu checkbox sayısını bulmak için
sayi=document.deneme.isim.lenght;
şeklinde bir kod kullanacağız. Bu şekilde bir kullanım sayi değişkenine 3 değerini aktaracaktır. Yine checkbox elemanlarının bir dizi içerisinde tutulduğunu gördük öylese bu indexin elemanları isim[0],isim[1] ve isim[2] olacaktır. Bu elemanlar ile artık işlem yapabiliriz. Yapabileceğimiz iki işlem bulunuyor bunlardan ilki her elemanın sabit olan value değerini okumak; mesela isim[0] elemanının value değerinin ahmet olduğunu biliyoruz. Birde biz bu elemanın işaretli olup olmadığını kontrol edeceğiz bunun içinde checked metodunu kullanıyoruz. Mesela isim[0] ın işaretli olup olmadığını isaretliMİ=document.deneme.isim[0].checked; yazarak bulabiliriz.
Şimdi bir örnek form üzerinde çalışalım. Formumuz yukarıda gördüğümüz deneme formu olacak. Sonuçları ise ayrıntılı olarak göreceğiz.
<html> <head> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-9"> <title>textalanına değer aktarmak</title> <script> <!-- gizle function goster(){ isim0value=document.deneme.isim[0].value; isim1value=document.deneme.isim[1].value; isim2value=document.deneme.isim[2].value; isim0checked=document.deneme.isim[0].checked; isim1checked=document.deneme.isim[1].checked; isim2checked=document.deneme.isim[2].checked; document.write("isim[0] value değeri : "+isim0value+ "<br>isim[0] checked değeri : "+isim0checked+"<p>"); document.write("isim[1] value değeri : "+isim1value+ "<br>isim[1] checked değeri : "+isim1checked+"<p>"); document.write("isim[2] value değeri : "+isim2value+ "<br>isim[2] checked değeri : "+isim2checked+"<p>"); } // gizleme sonu --> </script> </head> <body> <form name=deneme> <input type=checkbox name=isim value=ahmet> <input type=checkbox name=isim value=mehmet> <input type=checkbox name=isim value=hasan><br> <input type=button value=tamam onClick="goster()"> </form> </body> </html>
|