Homepage in echtzeit ändern

Übersicht Sonstiges Smalltalk

Neue Antwort erstellen

Geeecko

Betreff: Homepage in echtzeit ändern

BeitragDi, Sep 30, 2008 23:03
Antworten mit Zitat
Benutzer-Profile anzeigen
Huhu!
Wer kennt das nicht?
Man hat eine Internetseite und ein Gästebuch.
Man schreibt einen Gästebuch eintrag, wird weitergeleitet das er eingetragen wordern ist, und kommt dann wieder zum Gästebuch
Ich habe ein Script (Javascript) geschrieben, welches nur bestimmte Teile der Homepage updaten kann.
Code: [AUSKLAPPEN]

<a href="javascript:LoadData('text','')">Text neu laden!</a>
<p id="text">Hier steht der aktuelle Text</p>

Drückt man nun auf "Text neu laden!" wird die gesamte Seite neu heruntergeladen, und das Element (in unserem Fall das Element mit der ID "text") geupdatet.
Hat man, während der User auf der Internetseite war, die Seite bearbeitet:
Code: [AUSKLAPPEN]

<a href="javascript:LoadData('text','')">Text neu laden!</a>
<p id="text">Neuer Text</p>
<p>Ich bin eig gar nicht da!</p>

Dann wird der Text "Hier steht der aktuelle Text" zu "Ich bin eig gar nicht da!".
Dies ist wie gesagt, recht nützlich für Gästebücher etc.

Jetzt der Source:
Code: [AUSKLAPPEN]

<script type="text/javascript">
  function LoadData(ElementID) {
    //Neues HTTP-Request erstellen
    var request = new XMLHttpRequest();
    //Neue Zeit-Klasse
    var time = new Date();
    //Daten abrufen
    request.open('GET','index.html?'+time.getUTCMilliseconds());
    //Funktion wird aufgerufen, wenn der Text fertig geladen worden ist
    request.onreadystatechange = function() {
      if(request.readyState == 4) {
       UpdateElement(ElementID,request.responseText);
      }
    }
    //Request beenden
    request.send(null);
  }
 
  function UpdateElement(ElementID, response) {
    //DIV-Container raussuchen
    var div = document.getElementById("laweb_update_temp");
    //Antwort in den DIV-Container schreiben
    div.innerHTML = response;
    //Elemente suchen
    var new_node = FindElement(div.childNodes,ElementID);
    //Das zu updatende-Element
    var old_node = document.getElementById(ElementID);
    //Updaten
    old_node.innerHTML = new_node.innerHTML;
  }
 
 
  function FindElement(Parent,ID){
    //Elemente durchgehen
    for (var i = 0; i<Parent.length; i++) {
      //Fals die ID´s übereinstimmen
      if(Parent[i].id == ID) {
        //Node zurück geben
        return Parent[i];
      }
    }
    //Wenn Kinder vorhanden sind
    if(Parent.hasChildNodes() == true) {
      return FindElement(Parent.childNodes,ID);
    }
  }
</script>


Das einzige was gemacht werden muss, ist den Quellcode oben in die HTML/PHP Datei einzufügen,
und ans Ende der Datei folgenden Code hängen:
Code: [AUSKLAPPEN]

<div id="laweb_update_temp" style="visibility: hidden;">
</div>


Nun kann mit LoadData(ElementID,Extra) jedes Element erneuert werden.
ElementID = ID vom Element welches erneuert werden soll
Extra = Parameter die mit übergeben werden sollen beim neu laden (zum Beispiel der Name vom Ersteller eines Gästebucheintrags)

Ich würd emich über Kritik freuen!
lg MD

PS: Was noch kommen soll: Das man mehrer ID´s updaten kann... Sonst ist noch nichts geplant.

Blitzcoder

Newsposter

BeitragDi, Sep 30, 2008 23:37
Antworten mit Zitat
Benutzer-Profile anzeigen
Sicherlich, sowas nennt man AJAX. Nur dafür gibt es bereits eine Menge gute Frameworks (prototype etc.), die auch die Browser berücksichtigen etc. Das funktioniert nicht überall gleich, schon gar nicht in älteren IEs. Zudem hast du keine Behandlung von Fehlern, falls die Verbindung wegbricht oder so.

Mein Vorschlag: Nutze lieber etwas wie prototype und schreib eine nette webapp damit Wink
P4 3 Ghz@3,55Ghz|GF 6600GT 256MB|Samsung 80GB | 2x Samsung 160GB|2048MB DDR-400 RAM|6 Mbit Flatrate | Logitech G15 | Samsung 225BW-TFT | Ubuntu Gutsy Linux | Windows Vista | Desktop | Blog | CollIDE | Worklog
________________
|°°°°°°°°°°°°°°||'""|""\__,_
|______________ ||__ |__|__ |)
|(@) |(@)"""**|(@)(@)****|(@)

Geeecko

BeitragMi, Okt 01, 2008 0:06
Antworten mit Zitat
Benutzer-Profile anzeigen
Das ist mir bekannt ^^
Aber ich wollte das selber schreiben, da ich so mehr von der Materie verstehe,
und es nach meinen Wünschen erweitern kann.
Aber danke Wink

BtbN

BeitragMi, Okt 01, 2008 9:03
Antworten mit Zitat
Benutzer-Profile anzeigen
Die methode wie du das Request-Objekt holst wird so nicht in allen Browsern funktionieren.

Smily

BeitragMi, Okt 01, 2008 9:09
Antworten mit Zitat
Benutzer-Profile anzeigen
Was noch zu sagen wäre:
Die Funktion deiner Seite darf nicht vom JavaScript abhängig sein. Du solltest sozusagen prüfen, ob JavaScript überhaupt läuft und nur dann die Seite dynamisch machen.
Das könntest du z.B., in dem du den senden-button deines Gästebuchs eigentlich auf ein Statisches Script verlinkst, aber in einem onload halt das statische ziel entfernst und dem button eine javascript-funktion hinzufügst.

Prüfe auf jeden fall, ob deine Seite in einem Textbrowser ordentlich bedienbar ist

ciao,
Smily0412
Lesestoff:
gegen Softwarepatente | Netzzensur | brain.exe | Unabhängigkeitserklärung des Internets

"Wir müssen die Rechte der Andersdenkenden selbst dann beachten, wenn sie Idioten oder schädlich sind. Wir müssen aufpassen. Wachsamkeit ist der Preis der Freiheit --- Keine Zensur!"
stummi.org

BtbN

BeitragMi, Okt 01, 2008 9:12
Antworten mit Zitat
Benutzer-Profile anzeigen
Selbst die Textbrowser beherschen mittlerweile JavaScript, zumindest links2. Dort wäre solch ein Script auch kein Problem.

Smily

BeitragMi, Okt 01, 2008 9:40
Antworten mit Zitat
Benutzer-Profile anzeigen
Man kann trotzdem nicht erwarten, dass jeder User mit einem Javascript-Fähigen Klicki-Bunti-Browser unterwegs ist. Häufig schalte ich z.B. JS defaultmäßig ab und aktiviere es nur bei speziellen seiten.
Lesestoff:
gegen Softwarepatente | Netzzensur | brain.exe | Unabhängigkeitserklärung des Internets

"Wir müssen die Rechte der Andersdenkenden selbst dann beachten, wenn sie Idioten oder schädlich sind. Wir müssen aufpassen. Wachsamkeit ist der Preis der Freiheit --- Keine Zensur!"
stummi.org

peacemaker

BeitragMi, Okt 01, 2008 11:16
Antworten mit Zitat
Benutzer-Profile anzeigen
Es gibt ja nen Tag der abfrag, ob JS an oder aus ist.
Ansonsten ist Ajax eine sehr coole Sache. Du findest ziemlich viele Tutorials darüber im i-net.
Ich habe mal mit atlas und asp.net rumgespielt. Ich würde dir aber jQuery empfehlen. Gratis und sehr umfangreich.

mfG
~Tehadon~
www.tehadon.de
http://www.blitzforum.de/worklogs/14/

The_Nici

BeitragMi, Okt 01, 2008 14:08
Antworten mit Zitat
Benutzer-Profile anzeigen
Man könnte auch eine sich selbst ladende PHP-Seite machen, nur manche Browser wollen da ne Sonderbestätigung dass man die Seite automatisch neu laden will. Surprised

MfG

Smily

BeitragMi, Okt 01, 2008 14:23
Antworten mit Zitat
Benutzer-Profile anzeigen
The_Nici hat Folgendes geschrieben:
Man könnte auch eine sich selbst ladende PHP-Seite machen, nur manche Browser wollen da ne Sonderbestätigung dass man die Seite automatisch neu laden will. Surprised

MfG


Es geht ja darum, genau das zu vermeiden Wink
Lesestoff:
gegen Softwarepatente | Netzzensur | brain.exe | Unabhängigkeitserklärung des Internets

"Wir müssen die Rechte der Andersdenkenden selbst dann beachten, wenn sie Idioten oder schädlich sind. Wir müssen aufpassen. Wachsamkeit ist der Preis der Freiheit --- Keine Zensur!"
stummi.org

Neue Antwort erstellen


Übersicht Sonstiges Smalltalk

Gehe zu:

Powered by phpBB © 2001 - 2006, phpBB Group