Wenn Sie eine HTML-Seite geladen haben, befindet sich die komplette Seite auf dem Client. Die Ansicht kann mittels Javascript verändert werden. Texte können ausgeblendet, eingeblendet werden. Was ist aber, wenn Sie Informationen nachladen wollen?
Wann muss ich überhaupt nachladen?
Beispiel: Ein User gibt seine Postleitzahl in eine Form ein. Jetzt soll automatisch der Ortsname in ein weiteres Feld eingetragen werden. Jetzt haben Sie 3 absolute verschiedene Möglichkeiten!
1 - Sie haben alle PLZ und Ortsnamen bereits geladen und blenden Sie mit Hilfe von Javascript ein! Der Nachteil ist offensichtlich. Alle PLZ und Ortsnamen mussten vorher bereits empfangen werden! Ein riessen Daten-Traffic ist die Folge.
2 - Sie führen eine POST aus und ermitteln den Ortsnamen. Die Seite wird dann wieder komplett neu geladen! Besser als Variante 1, aber trotzdem nicht wirklich gut.
3 - Sie teilen dem Server die PLZ mit und empfangen einfach nur den Ortsnamen passend zur PLZ. --> minimaler Traffic und schnell.
Die 3. Variante werde ich jetzt zeigen. Der Trick hierbei ist ein Internet Explorer Feature zu nutzen - "showModalDialog()"
Diesen habe ich bereits in einem Artikel vorgestellt.
So funktioniert´s:
Eine Webseite öffnet per Javascript den ModalDialog mit der Methode "showModalDialog". Die aufgerufene Seite kann einen Parameter an die Aufruferseite übergeben. Da der ModalDialog mit Name und Querystrings aufgerufen werden darf, kann der Server die Seite und damit auch den Javascript-Parameter dynamisch generieren.
noRemote.htm - die Hauptseite
<HTML> <HEAD> <SCRIPT LANGUAGE=javascript> <!-- function getSomeThing(sText) { var sLnk = 'noRemoteFetcher.asp?ToDo=DoThis&ID=' + sText var x = new Array(); x = showModalDialog(sLnk,'','dialogHeight: 50 px; dialogWidth: 400 px; status: no;'); for (i=0; i<x.length; i++) { document.all.iLoadedText.innerHTML+=x[i]; document.all.iLoadedText.innerHTML+='<br>'; } } //--> </SCRIPT> </HEAD> <input type="text" name="text1" id="text1"> <input type="button" onclick="getSomeThing(document.all.text1.value);" value="Nachladen"> <div id="iLoadedText"></div> </BODY> </HTML> |
!!! Der Inhalt des Textfeldes "text1" fliesst in den Querystring mit ein !!!
noRemoteFetcher.asp - der ModalDialog
<%@ Language=VBScript %> <% dim sToDo ' --- Was ist zu tun ? dim sData ' --- Der Inhalt des Javascript-Arrays dim sJava ' --- Der Javascript-CodesToDo = Request.QueryString("ToDo") select case sToDo case "DoThis" ' --- Javascript Anweisungen generieren sData = "'Werte','die','wir übergeben','" & Request.QueryString("id") & "'" sJava = "var arrContent = new Array(" & sData & ");" & vbCrlf sJava = sJava & "window.returnValue=arrContent;" & vbCrlf sJava = sJava & "window.close();" end select %> <HTML> <HEAD> <SCRIPT LANGUAGE=javascript> <!-- var i = new Number(0); setInterval('Loading()', 100); function Loading() { document.all.iLoading.innerHTML+='@'; i++; if (i > 3) CallBack(); } function CallBack() { <%=sJava%> } //--> </SCRIPT> </HEAD> <BODY><div id="iLoading"><b>Loading</b></div></BODY></HTML> |
Zum Ausprobieren gibt unten die Source-Codes als ZIP-File