AJAX ASP Örneği
AJAX, daha etkileşimli uygulamalar oluşturmak için kullanılır.
AJAX ASP Örneği
Aşağıdaki örnek, bir kullanıcı bir giriş alanına karakterleri yazarken bir web sayfasının bir web sunucusuyla nasıl iletişim kurabileceğini gösterecektir:
Örnek
Start typing a name in the input field below:
Örnek Açıklama
Yukarıdaki örnekte, bir kullanıcı giriş alanına bir karakter yazdığında, "showHint()" adlı bir işlev yürütülür.
İşlev, onkeyup olayı tarafından tetiklenir.
İşte HTML kodu:
Örnek
<html>
<head>
<script>
function showHint(str) {
if (str.length == 0) {
document.getElementById("txtHint").innerHTML = "";
return;
} else {
var xmlhttp = new
XMLHttpRequest();
xmlhttp.onreadystatechange = function()
{
if (this.readyState == 4 &&
this.status == 200) {
document.getElementById("txtHint").innerHTML =
this.responseText;
}
};
xmlhttp.open("GET", "gethint.asp?q=" + str, true);
xmlhttp.send();
}
}
</script>
</head>
<body>
<p><b>Start typing a name in the
input field below:</b></p>
<form>
First name: <input type="text"
onkeyup="showHint(this.value)">
</form>
<p>Suggestions: <span id="txtHint"></span></p>
</body>
</html>
Kod açıklaması:
İlk önce giriş alanının boş olup olmadığını kontrol edin (str.length == 0). Öyleyse, txtHint yer tutucusunun içeriğini temizleyin ve işlevden çıkın.
Ancak giriş alanı boş değilse aşağıdakileri yapın:
- Bir XMLHttpRequest nesnesi oluşturun
- Sunucu yanıtı hazır olduğunda yürütülecek işlevi oluşturun
- İsteği sunucudaki bir ASP dosyasına (gethint.asp) gönderin
- q parametresinin gethint.asp?q="+str eklendiğine dikkat edin.
- str değişkeni, giriş alanının içeriğini tutar
ASP Dosyası - "gethint.asp"
ASP dosyası bir dizi adı kontrol eder ve karşılık gelen adları tarayıcıya döndürür:
<%
response.expires=-1
dim a(30)
'Fill up array with names
a(1)="Anna"
a(2)="Brittany"
a(3)="Cinderella"
a(4)="Diana"
a(5)="Eva"
a(6)="Fiona"
a(7)="Gunda"
a(8)="Hege"
a(9)="Inga"
a(10)="Johanna"
a(11)="Kitty"
a(12)="Linda"
a(13)="Nina"
a(14)="Ophelia"
a(15)="Petunia"
a(16)="Amanda"
a(17)="Raquel"
a(18)="Cindy"
a(19)="Doris"
a(20)="Eve"
a(21)="Evita"
a(22)="Sunniva"
a(23)="Tove"
a(24)="Unni"
a(25)="Violet"
a(26)="Liza"
a(27)="Elizabeth"
a(28)="Ellen"
a(29)="Wenche"
a(30)="Vicky"
'get the q parameter from URL
q=ucase(request.querystring("q"))
'lookup all hints from array if length of q>0
if len(q)>0 then
hint=""
for i=1 to 30
if q=ucase(mid(a(i),1,len(q))) then
if hint="" then
hint=a(i)
else
hint=hint & " , " & a(i)
end if
end if
next
end if
'Output "no suggestion" if no hint were found
'or output the correct values
if hint="" then
response.write("no suggestion")
else
response.write(hint)
end if
%>