AJAX’IN nasıl çalıştığını anladıysanız şimdi ilk uygulamamızı yapabiliriz. İlk önce basit bir HTML formu hazırlayalım.
Formun “username” ve “time” isimli iki tane alanı olsun. “username” alanı kullanıcı tarafından girilsin, “time” ise AJAX ile doldurulsun istiyoruz.
HTML dosyasının ismini testAjax.htm şeklinde kaydedelim.
testAjax.htm aşağıdaki kodları:
<html>
<body>
<script type=”text/javascript”>
function ajaxFunction()
{
var xmlhttp;
if (window.XMLHttpRequest)
{
// IE7+, Firefox, Chrome, Opera, Safari için
xmlhttp=new XMLHttpRequest();
}
else
{
// IE6, IE5 için
xmlhttp=new ActiveXObject(“Microsoft.XMLHTTP”);
}
xmlhttp.onreadystatechange=function()
{
if(xmlhttp.readyState==4)
{
document.myForm.time.value=xmlhttp.responseText;
}
}
xmlhttp.open(“GET”,”time.asp”,true);
xmlhttp.send(null);
}
</script>
<form name=”myForm”>
Name: <input type=”text” name=”username” onkeyup=”ajaxFunction();” />
Time: <input type=”text” name=”time” />
</form>
</body>
</html>
xmlhttp isimli bir XMLHttpRequest nesnesi tanımladık. xmlhttp=new XMLHttpRequest() şeklinde.
bir de time.asp oluşturup, ordan değer döndürmemiz gerekiyor. Çünkü username alanına bir değer girildiğinde AJAX fonksiyonu time.asp ye gidip değer geri getirmek isteyecek.
time.asp ise şöyle.:
<%
response.expires=-1
response.write(time)
%>
Bu örnekte yaptığımız işlem, “username” alanına bir harf girildiğinde “time” alanına zamanı getirmiş olduk.
Uyarı Sev.
Paylasım Gücü
Kayıt tarihi
Ruh
Grafik Düzey
Tarayıcın