Tasten klappern

Teil 3: Chatsystem unter AJAX

Unser Chat-Programm demonstriert das Potenzial von AJAX. Eine HTML-Seite gestaltet die Benutzeroberfläche. Dort gibt der Anwender Nachrichten ein, die Sie an das Chat- System übermitteln. Ein Eingabefeld und eine Schaltfläche auf der HTML-Seite übermitteln die Daten zum Server. Per Input-Tag definieren Sie Eingabekomponenten. Das Typ-Attribut legt fest, was für eine Komponente Sie anlegen. Das Beispiel begnügt sich mit einem Eingabefeld (text) und einer Schaltfläche (button). Zum Schluss definiert das onclick- Attribut, welche Methode (sendMessage) aufgerufen werden soll, wenn der Anwender die Schaltfläche anklickt.

Chatsystem unter AJAX

© Archiv

Erster Aufruf: Das Chatsystem präsentiert sich mit der Eingabemaske und dem Übermitteln-Schaltknopf.

Damit die HTML-Seite auf dasDWR-System zugreifen kann, brauchen Sie Deklarationen. Dabei müssen Sie der HTML-Seite mitteilen, welche JavaScripte das DWR zur Verfügung stellt. Die Hauptfunktionalität enthält dasScript engine. js, während die Hilfsfunktionen des DWRs mit dem Script util.js auskommen. Zum Schluss wollen Sie Ihre neue Javaklasse als JavaScript innerhalb der HTML-Seite verfügbar machen. Das DWR-System generiert dafür dynamisch das JavaScript Chat.js auf Basis der Javaklasse (Chat). Anschließend bauen Sie die Funktion sendMessage() ein. Diese ruft der Anwender per Schaltfläche auf.

In dieser Methode rufen Sie den Inhalt des Eingabefeldes mit der Methode getValue() ab. Danach weisen Sie dem Eingabefeld einen leeren Inhalt zu, damit es neue Eingaben aufnehmen kann. Zum Schluss bauen Sie in der Methode gotMessage() die neue Nachricht als String zusammen und fügen diesen per addMessage() einem Listen-Objekt hinzu. Die Liste verwaltet alle eingegangenen Nachrichten. Für die HTML-Seite speichern Sie vorläufig diese Nachrichten in der Variablen chatlog. Die HTML-Seite finden Sie im Listing1.html.

Mehr zum Thema

Facebook Alternative
Social Networks

Sind Sie auf der Suche nach einer Facebook-Alternative? Hier finden Sie unsere Empfehlungen für die besten Social Networks: natürlich ohne Facebook.
Netflix
Streaming

Preise, kompatible Geräte, Datenrate, Serien- und Filmangebot von Netflix: Wir beantworten die wichtigsten Fragen rund um den Streaming-Dienst.
Whatsapp auf PC
Mit oder ohne Download

Mit Whatsapp Web oder der Whatsapp Desktop-App nutzen Sie den Messenger bequem am PC. Wir erklären Download, Installation und Einrichtung.
Spam-Mails
6 Tipps gegen E-Mail Betrug

Betrüger versenden E-Mails, die es auf Ihre Daten und Ihr Geld abgesehen haben. Wie Sie Phishing E-Mails erkennen und sich schützen.
The Grand Tour - Staffel 2 - Amazon Prime Original
Vorschau auf Film- und Serien-Highlights

Amazon Prime Video lockt im Dezember 2017 mit Film-Highlights wie "My Big Fat Greek Wedding 2" und neuen Folgen von "The Grand Tour
News
Minecraft-Server waren das ursprüngliche Ziel
Alternative zu MacBook Pro und Surface Book