Verständnisfrage zu Ajax

[Taney]

Hallo, hätte eine kleine Verständnisfrage zu Ajax.
Bisher arbeitet unsere Seite mit HTTPRequest. Was ich nun bei Ajax nicht so checke, wie man ohne Reload eine Benutzeroberfläche aktualisiert.

Nehmen wir an, dass eine Seite von einem eingeloggten Mitglied geladen wird.
Nehmen wir an, dass für den User ein Bereich „Freundesliste“ ausgeklappt ist und die Information in der DB gespeichert.
„KlappFreunde = 1“ Wenn KlappFreunde = 0 ist, wäre der Bereich eingeklappt.
Jetzt drückt das Mitglied auf einklappen und macht den Bereich „Freundesliste“ zu. Wie kommt dann die Information die DB ohne ein Reload, so dass bei einem nächsten Besuch, bzw. späteren Einloggen, der Bereich eingeklappt ist?

Ich hoffe, dass dies kein dummes Beispiel war.
Man könnte genauso ein Beispiel mit einer Seite  „Einstellung“ nehmen. Man speichert zum Beispiel Benutzerinformationen, Profilangaben ohne ein Reload. Man füllt Formularfelder aus oder klickt einen Radiobutton und der Inhalt wird übernommen und dementsprechend wird etwas ausgegeben, bzw. der Bereich ausgeblendet.
Wäre super, wenn mir das jemand kurz und verständlich erklären könnte.

In google habe ich dies gefunden:
"Bei ajax werden nach dem ersten Laden der Seite nur noch Daten mit dem Server ausgetauscht. Dabei wird die benötigte Bandbreite stark reduziert und der User bekommt meist unmittelbares Feedback auf seine Interaktionen. Die ajax engie selbst wird als JavaScript implementiert. Dabei werden Benutzeraktioenen im Script verarbeitet und Anforderungen (Requests) mit der XMLHttpRequest-Methode an den Server geschickt. Die Antwort wird in einer Callback-Funktion verarbeitet und die Benutzeroberfläche wird ohne Reload aktualisiert."

Nebenbei noch. Welches Buch würdest ihr zum Einstieg empfehlen?
Ich lerne zurzeit Java und JSP. "Java ist eine Insel 6"

Grüße

[Thomas Rubbert]

Da steht doch, wie Ajax funktioniert. Du rufst mit Javascript eine Datei vom Server ab, und guckst dir an was in der Datei steht.

In deinem Fall wuerdest du z.B. die Datei (vorrausgesetzt du nutzt PHP) close_friend_list.php?user_id=3 abrufen. Alles was close_friend_list.php macht ist fuer den User mit der user_id=3 den Wert in der Datenbank veraendern und bei erfolg "true" ausgeben, oder (z.B. wenn die user_id ungueltig ist) "false" zurueck geben. Zurueck geben bedeutet dass die Datei kein Html oder Xml ausgibt sondern nur "false" oder "true" im Klartext. Im Javascript kannst du so ueberpruefen ob die Aktion erfolgreich war, und eventuell dem User bescheid geben.

Im Javascript musst du natuerlich die '3' durch die echte User Id ersetzen, oder den User irgendwie anders identifizieren.

Ich wuerde dir dringend empfehlen ein Ajaxframework zu benuzten, ich persoenlich arbeite mit Prototype ( http://prototypejs.org/ ) weil es noch einige nuetzliche andere Funktionen mitbringt, aber es gibt auch schlankere Frameworks die ausschliesslich Ajax vereinfachen.

mfg, thomas

[Auge]

Hallo

Nehmen wir an, dass eine Seite von einem eingeloggten Mitglied geladen wird.
Nehmen wir an, dass für den User ein Bereich „Freundesliste“ ausgeklappt ist und die Information in der DB gespeichert.
„KlappFreunde = 1“ Wenn KlappFreunde = 0 ist, wäre der Bereich eingeklappt.
Jetzt drückt das Mitglied auf einklappen und macht den Bereich „Freundesliste“ zu.

Soweit ist das "stinknormales" JavaScript.

Wie kommt dann die Information die DB ohne ein Reload, so dass bei einem nächsten Besuch, bzw. späteren Einloggen, der Bereich eingeklappt ist?

Genau hier kommt Ajax in's Spiel. Die JavaScript-Funktion, die den Bereich ein- und ausklappt, kontaktiert ein Skript auf dem Server ohne die Seite neu vom Server zu laden, welches den Wert in der DB umsetzt und eine Rückmeldung über Erfolg/Misserfolg gibt. Wenn der Erfolg vermeldet wurde, wird im Browser der Bereich ein- bzw. ausgeklappt, damit die Einstellung auf dem Server mit der tatsächlichen Ansicht im Browser übereinstimmt. Wenn die Aktion auf dem Server fehlschlug, sollte, je nach Anwendungsfall, eine entsprechende Ausgabe erfolgen (Fehlermeldung).

Somit ist die Ansicht im Browser verändert und dieser Zustand auf dem Server vermerkt.

Tschö, Auge