Mit Ajax schauen ob neue Nachricht vorhanden ist!

webdoktor

webdoktor

Angesehenes Mitglied
Hallo zusammen

Ich habe wieder eine kleine Frage und zwar geht es um folgendes.
Auf unserer Plattform http://www.younique.ch/ können Nachrichten
an andere Benutzer gesendet werden.

Sobald ein Benutzer eine neue Nachricht erhält wird der Button
"Meine Nachrichten" grün. So soll es auch sein jedoch mache ich
die Überprüfung mit einem Refresh welches alle 3 Minuten passiert.

Diese Methode finde ich nicht so schön, da ich einige Formulare auf
der Seite habe und wenn dann jemand etwas am ausfüllen ist und
es ein Refresh macht, sind alle seine Eingaben weg.

Nun meine Frage, es wäre doch irgendwie möglich, die Überprüfung
mit AJAX zu machen damit es nicht immer die ganze Seite läd...?

Kann mir jemand helfen?

Freue mich über jeden Tipp und Hilfe.
Gruss Marco
 
CODE var Ajx,
   Url = '/HAT_NEUE_NACHRICHT_FRAGEZEICHEN';

CheckMessagesCallback = function()
{
  if (Ajx.readyState == 4)
  {
     if(Ajx.responseText == 'HAT NACHRICHT')
     {
   //neue nachricht ist da
   document.getElementById('NachrichtenButtonID').className = 'gruen';
        Init();
     }
   }
}

CheckMessages = function()
{
//wie man nun am besten das objekt erstellt ist eine glaubensfrage
Ajx = HTTP_REQUEST_OBJECT;

Ajx.onreadystatechange = CheckMessagesCallback;
Ajx.open('GET', Url, true);
Ajx.send(null);
}


Init = function()
{
window.setTimeout('CheckMessages', 3 * 60 * 1000);
}

window.onload = Init;



soetwas?
 
Über setTimeout() kannst du alle 3 Minuten eine Javascript-Funktion aufrufen.
Diese greift dann per AJAX auf eine PHP-Datei zu, z.B. unter http://www.domain.tld/istNeueNachrichtVorhanden.php.
Die PHP-Datei überprüft dann anhand der Cookies welcher Nutzer auf diese Datei zugreift und prüft über eine entsprechende DB-Abfrage ob die Daten korrekt sind und ob neue Nachrichten vorliegen.
Falls neue Nachrichten vorliegen gibt die PHP-Datei eine "1" zurück (und nicht mehr), sonst eine "0".
Über Javascript wird dann die Rückgabe ausgewertet. Falls eine "1" zurückgegeben wurde wird das Bild des Buttons geändert indem auf das src-Attribut zurückgegriffen wird. Sonst passiert nichts.
Anschließend wird der nächste Funktionsaufruf per setTimeout() gestartet.

Das einzige was daran etwas komplizierter sein könnte wäre das AJAX-Kommando. Für AJAX gibt es aber inzwischen genügend Bibliotheken im Web, sodass du da nur noch einstellen musst welche Adresse aufgerufen werden soll und welche Funktion anschließend die Callback-Funktion ist an die die Daten übergeben werden, die die PHP-Datei ausgespuckt hat.
 
Hallo zusammen

Vielen Dank für die prompten Antworten.
Huiii da verstehe ich bis jetzt nur Bahnhof :)

Muss mich wohl unbedingt mal bei AJAX einwenig einlesen
damit ich dass dann verwirklichen kann. Weil ich muss es
drigend so lösen. Mit dem Refresh ist es einfach nicht wirklich
eine zufriedenstellende Lösung.

Gruss Marco
 
QUOTE (webdoktor @ Sa 25.04.2009, 21:47)
Huiii da verstehe ich bis jetzt nur Bahnhof :)



Ich würd dir da generell ein JS-Framework empfehlen.
Da kannst du auch ohne Ahnung von JavaScript oder AJAX sehr schnell solche Funktionalitäten schreiben.
Ich bevorzuge jQuery dafür.

 
Hi ConnectR

Ja mit jQuery habe ich schon mal eine kleine Bilder-Animation realisiert.
Hmm, muss mich wirklich unbedingt mal reinlesen damit ich das verwirklichen
kann.

Hast Du denn einen Ansatz wie ich das mit jQuery machen kann?

Marco
 
CODE

<html>
<head>

<script src="http://code.jquery.com/jquery-latest.js"></script>

<script>
var check = setInterval(function()
{
   $('#nachrichten').load('testing.php');
}, 1000);
</script>

</head>
<body>


<div id="nachrichten">Du hast keine neuen Nachrichten</div>

</body>
</html>




Beim ersten Aufruf steht in dem Div "Du hast keine neuen Nachrichten".
Die 1000 in der JS-Funktion gibt an, das jede Sekunde ein Refresh anhand der Datei testing.php gemacht werden soll.
Das kannst du beliebig hochsetzen.
In testing.php kannst du mit PHP schauen, ob der User neue Nachrichten hat.
Ich würde empfehlen, an die testing.php eine Session-Id dran zu hängen, ind er die Benutzer-ID des Users gespeichert ist.
Dann weisst du immer, von welchem User der Aufruf kam.
Der Inhalt des DIV mit der ID "nachrichten" wird durch den Inhalt aus testing.php ersetzt.
Bei dir müsstest du also statt Zahl und Text dann die rote/grüne Grafik einsetzen.

Und hier kannst du sehen, was das obige Script macht.

In meiner testing.php steht im Moment nur ein
CODE echo 'Du hast '.rand(0, 15).' neue Nachrichten';
drin ;-)
 
QUOTE (webdoktor @ Sa 25.04.2009, 21:47) Vielen Dank für die prompten Antworten.
Huiii da verstehe ich bis jetzt nur Bahnhof :)


Könntest den, Button der grün wird, auch in einen iFrame packen ...
... den MetaRefrash dann für den iFrame ... dann bleiben die Formulare in "der normalen Seite" erhalten

Button = FormButton .... im "form action" noch einen "target=_Top" rein, damit nach dem Klick auf den Button de seite nicht im "klitzekleinen iFrame" laden will


wäre so eine kleine Lösung auf die schnelle
 
Hallo zusammen

Nochmals herzlichen Dank für Eure Bemühungen und Antworten.

@800XE das mit dem iframe habe ich mir auch schon überlegt,
aber eigentlich möchte ich auf iframe resp. frames ganz verzichten.
Werde mich wohl an die komplizierte Variante mit AJAX dran machen.
Mal schauen ob ich das auf die Reihe kriege :) Trotzdem danke für
Deinen Tipp und Hilfe!

@ConnectR
Danke für Dein super Beispiel. Ich werde mir das Heute Abend einmal
in Ruhe anschauen. Mal schauen ob ich das die Reihe kriege :)

Gruss Marco
 
Mit jQuery ist das ganz einfach! Habe schon etliche Sachen wie Chat, Gästebücher, Bewertungs Systeme, Bilder Galerien, Click Counter usw. gemacht.

Beispiele gibt es auf meinem Blog oder schreib mir direkt mal schnell an.

http://www.jakblog.ch
 
Hi zusammen

Ich habe das ganze nun einmal in die Seite eingebunden und "fast" klappt
alles. Jedoch ein kleines Problem habe ich noch und zwar wird das Script
ja alle Sekunden ausgeführt d.h. wenn ich nun zwischen Seiten hin und her
zappe, dann zeigt es zuerst "keine" Nachricht an und erst nach 1 Sekunde
werden dann die Anzahl Nachrichten angezeigt.

Wisst ihr was ich meine?

LG Marco
 
QUOTE Chat, Gästebücher, Bewertungs Systeme, Bilder Galerien


Ich will ja nicht der Bu-Mann sein, aber für AJAX verwende ich eigene Frameworks.
Ein Chat hat komplett andere Anforderungen als bspw. ein Bewertungssystem.

Für einen Chat bspw. hatte ich ein Framework mit den Methoden say(), talk(), call() usw.
Für ein Bewertungssystem reicht eine einfache JQuery-Anforderung mit get
 
QUOTE (webdoktor @ So 26.04.2009, 09:58) zeigt es zuerst "keine" Nachricht an und erst nach 1 Sekunde
werden dann die Anzahl Nachrichten angezeigt.

Ist natürlich klar.. Aber du kannst doch einfach den Text "Keine Nachrichten" mit dem richtigen Wert ersetzen? Und eben dieser wird dann per Ajax wieder aktualisiert.

Also beim Seitenaufbau schon die aktuelle Zahl mitgeben, und dann später aktualisieren.

Sollte doch kein Problem sein?



Gruß
Karsten
 
QUOTE (nitrit @ So 26.04.2009, 16:00)
QUOTE Chat, Gästebücher, Bewertungs Systeme, Bilder Galerien


Ich will ja nicht der Bu-Mann sein, aber für AJAX verwende ich eigene Frameworks.
Ein Chat hat komplett andere Anforderungen als bspw. ein Bewertungssystem.

Für einen Chat bspw. hatte ich ein Framework mit den Methoden say(), talk(), call() usw.
Für ein Bewertungssystem reicht eine einfache JQuery-Anforderung mit get

wollte ja nur Beispiele aufzeigen, was man mit jQuery alles machen kann und ich auch gemacht habe, dass es andere Anforderungen hat ist mir eigentlich klar.
rolleyes.gif
 
QUOTE (webdoktor @ So 26.04.2009, 10:58) Hi zusammen

Ich habe das ganze nun einmal in die Seite eingebunden und "fast" klappt
alles. Jedoch ein kleines Problem habe ich noch und zwar wird das Script
ja alle Sekunden ausgeführt d.h. wenn ich nun zwischen Seiten hin und her
zappe, dann zeigt es zuerst "keine" Nachricht an und erst nach 1 Sekunde
werden dann die Anzahl Nachrichten angezeigt.

Wisst ihr was ich meine?

LG Marco

Lade die Seite ganz normal mit den Informationen die jetzt gerade sind, dann nach x Minuten überschreibst du den Wert mit Ajax.
 
Hallo zusammen

Ich hab mal noch eine kleine Frage, wenn ich das so lade:

CODE <?

echo '<script> var check = setInterval(function()
{
$(\'#deal_bieten_benutzer\').load(\'inc_deal_bieten_unten.php?id='.$_GET[id].';\');
}, 1000);
</script>';

?>


Dann funktioniert es in Internet Explorer einwandfrei aber im Firefox wird immer die
ganz Seite neu geladen...

Wieso das?

Freue mich auf eure Antworten.
Marco
 
Also ich habe im Firefox keine Probleme feststellen können.
Ich würde aber nicht beide mit "var check" beginnen. Nenn einen davon "var irgendwas" oder so.
 
Hi ConnectR

Danke für Deine Antwort. Seit über 1h versuche ich ein Problem zu lösen
und zwar zeigt es nun in Firefox alles gut an. Im IE verschwindet der Teil
sobald es eigentlich neu geladen werden sollte (nach 1 Sekunde).

Ich finde den Fehler einfach nicht!

LG Marco
 
Ufff

Ich glaub ich habs gefunden. Da war ein <div> zuviel
Unglaublich und das nach 1h :)

Gruss Marco
 
Sie müssen sich einloggen oder registrieren, um hier antworten zu können.
Zurück
Oben