Latest web development tutorials

ASP - Ajax i ASP

AJAX jest używany do tworzenia interaktywnych aplikacji.


przykłady AJAX ASP

Poniższe przykłady pokazują, gdy użytkownik wpisze w polu wprowadzania znaków, jak strony internetowe komunikują się z serwerem WWW:

Przykłady

Start typing a name in the input field below:

First name:

Suggestions:



Przykłady wyjaśnić - strony HTML

Gdy użytkownik w powyższym postać "pole wejścia wykonuje showHint ()" funkcji. Funkcja ta polega na "onkeyup" wyzwalacza zdarzeń:

<!DOCTYPE html>
<html>
<head>
<script>
function showHint(str)
{
if (str.length==0)
{
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("txtHint").innerHTML=xmlhttp.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)" size="20">
</form>
<p>Suggestions: <span id="txtHint"></span></p>

</body>
</html>

Źródło wyjaśnił:

Jeśli pole wejściowe jest pusta (str.length == 0), funkcja ta będzie jasne txtHint treści zastępczy, a wyjście z funkcji.

Jeśli pole wejściowe nie jest pusty, to showHint () wykonuje następujące czynności:

  • Tworzenie obiektu XMLHttpRequest
  • Tworzenie funkcji, gdy serwer jest gotowy do przeprowadzenia reakcji
  • Plików na serwerze, aby wysyłać żądania
  • Należy pamiętać, że dodanie do (zawiera pole wejściowe) do końca parametru URL (Q)

plik ASP

Powyższe serwery poprzez javascript wywołaniem tej strony jest nazywany "gethint.asp" pliki ASP.

"Gethint.asp" kod źródłowy sprawdza tablicę nazw, a następnie powrócił do przeglądarki odpowiadającej nazwie:

<%
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
%>

Objaśnienie: Jeśli JavaScript wysyłać wiadomości tekstowe (np strlen ($ q) 0>) następuje:

  1. Znajdź pasujące znaki wysłać imiona JavaScript
  2. Jeśli nie zostanie znaleziony, łańcuch reakcji jest ustawiony na "brak sugestii"
  3. Jeśli okaże się jeden lub więcej pasujących imiona, nazwiska wszystkich ustawień z ciągiem odpowiedzi
  4. Wysłanie odpowiedzi do "txtHint" zastępczy