Archiv verlassen und diese Seite im Standarddesign anzeigen : [PHP/MySQL/JS] Live-Ticker mit Text aus Datenbank füttern
Popopinsel
2009-02-26, 11:19:01
Hallo zusammen,
ich bin gerade dabei, ein kleines News-System auf Basis von PHP und MySQL aufzubauen. Das Grundgerüst steht bisher, d.h. ich habe eine Hauptseite, auf der ich News eingeben (diese werden zum einen in der Datenbank gespeichert und tabellarisch auf dieser Editier-Seite aufgelistet) sowie geziehlt löschen kann und eine zweite Hauptseite, auf der neben Dokumenten wie .xls und .pfd im unteren Bereich ein Live-Ticker der News laufen soll.
Bisher läuft dort ein einfaches Marquee, welches sich den Text aus einem Array (der Datenbank) holt. Natürlich aktualisiert sich diese Laufschrift jetzt nur, wenn man die gesamte Seite neu läd.
Ich möchte aber, dass in einem gewissen Intervall dieser Ticker aktualisert wird (d.h. eine erneute Anfrage an das Array/die Datenbank) und zwar ohne die Bewegung des Tickers zu unterbrechen (die neueste News wird also ganz hinten dran gehängt).
Könnt ihr mir sagen, wie ich das mit PHP/JS hinbekomme?
In JS regelmäßig einen XMLHttpRequest auf ein php Script machen, das die News als XML ausgibt und dann mit JS und DOM den Ticker aktualisieren.
Popopinsel
2009-02-26, 12:34:44
In JS regelmäßig einen XMLHttpRequest auf ein php Script machen, das die News als XML ausgibt und dann mit JS und DOM den Ticker aktualisieren.
Äh, was? :redface: Also ich bin darin nicht so bewandert, ich bräuchte schon genauere Anweisungen oder ein gutes How-To! =)
instinct
2009-02-26, 13:05:16
Er meint du sollst Ajax verwenden :)
XmlHttpRequest ist ein asynchroner Aufruf eines Skriptes auf der Serverseite.
Popopinsel
2009-02-27, 11:27:58
Leider hab ich nich die geringste von Ajax... Kennt Ihr denn gute Seiten, wo ich Infos zu meinem Vorhaben bekomme? Habe schon endlos nach Livetickern in VErbindung mit MySQL gesucht...
darph
2009-02-27, 12:32:37
Du brauchst kein Ajax.
Das xmlhttprequest allerdings schon. Damit kannst du ein in der Seite laufendes JavaScript anweisen, in regelmäßigen Abständen eine Datei aufzurufen und der Inhalt der Datei wird dann deinem JavaScript-Code zur Verfügung gestellt. Das fügst du dann einfach in deinen DOM-Baum ein.
http://de.wikipedia.org/wiki/Xmlhttprequest bietet ein brauchbares Beispiel.
Popopinsel
2009-02-27, 14:05:18
Nach langem Suchen und basteln habe ich nun folgenden Code zusammegepflastert:
<?php
require("xajax_core/xajax.inc.php");
require('ShowNews.php');
$xajax = new xajax();
$xajax->registerFunction("ticker");
$xajax->processRequest();
function ticker(){
$data=ShowNews();
$response = new xajaxResponse();
$response->assign('divticker', 'innerHTML', $data);
return $response;
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>call Script Test | xajax Tests</title>
<?php $xajax->printJavascript("./") ?>
<script type="text/javascript">
function RefreshTicker()
{
intervalID = setInterval(xajax_ticker, 3000);
}
</script>
</head>
<body onload="RefreshTicker();">
<div id="divticker"></div>
</body>
</html>
Dabei wird in der ShowNews.php eine Verbindung zur MySQL-Datenbank aufgebaut und der Inhalt per echo zurückgegeben. Wenn ich im PHP-Code hier die Funktion ticker() schlicht ausgeben lasse(d.h. direkt im div-Tag), dann steht dort der Text aus der Datenbank.
Lediglich das aktualisieren nach einem Intervall funktioniert nicht, so als ob der JS-Part fehlerhaft ist.
Ich hoffe auf Eure Hilfe! =)
In JS regelmäßig einen XMLHttpRequest auf ein php Script machen, das die News als XML ausgibt und dann mit JS und DOM den Ticker aktualisieren.
Ich steh auf JSON statt XML :)
Popopinsel
2009-02-27, 23:38:32
Alles klar Leute, ich hab den Fehler gefunden! Und zwar darf ich die Werte aus der MySQL-Datenbank (durch die ShowNews.php) nicht mittels echo ausgeben, sondern muss es durch return machen!
Es läuft jetzt alles wunderbar! =)
Jetzt muss ich nur noch herausfinden, wie ich aus dem div-Tag eine Endlos-Laufschrift mache, also dass die Zeichenkette immer wieder hintereinander ausgegeben wird (wie ein live Nachrichten-Ticker eben).
Edit: Ich habe nun folgendes gefunden, angepasst und erfolgreich getestet:
<script type="text/javascript">
var geschwindigkeit=100;
var b=0;
var ticker_text="+++ Testtext +++ ";
function MoveTicker()
{
window.document.endlos_ticker_formular.endlos_ticker_feld.value=ticker_text.subs tring (b,ticker_text.length)+ticker_text.substring (0,b);
if (b<ticker_text.length)
{
b++;
}
else
{
b=0;
}
window.setTimeout ("MoveTicker()",geschwindigkeit);
}
</script>
Zusätzlich ist im body noch eine form (name="endlos_ticker_formular") sowie ein input (type="text" name="endlos_ticker_feld"). Also hab ich diesen Teil in mein bestehendes PHP-Script eingefügt, wo der Refresh der News bereits funktioniert.
<script type="text/javascript">
var geschwindigkeit=100;
var b=0;
var ticker_text="Huhu";
function RefreshTicker()
{
intervalID = setInterval(xajax_ticker, 1000);
}
function MoveTicker()
{
window.document.endlos_ticker_formular.endlos_ticker_feld.value=ticker_text.subs tring (b,ticker_text.length)+ticker_text.substring (0,b);
if (b<ticker_text.length)
{
b++;
}
else
{
b=0;
}
window.setTimeout ("MoveTicker()",geschwindigkeit);
}
</script>
Die Frage ist jetzt nur, wie ich diese beiden Funktionen verbinde und welche ich mit <body unload=""> aufrufe. Prinzipiell muss ich das Ganze ja so verschachteln, dass ich die Funktion MoveTicker() beim aufrufen der Seite starten lasse und diese den ständig aktualisierten Text aus der Funktion RefreshTicker() erhält. Ich weiß allerdings nicht, wie ich diesen variablen Text im window.document.xxx.value zuweise (als ticker_text eben).
vielleicht solltest du das lieber selber schreiben, als dir einen haufen code zusammenzuklauen und aneinander zu frickeln.
wird natürlich wesentlich länger dauern, aber du lernst was dabei und verstehst am ende vielleicht auch was du getan hast...
Popopinsel
2009-02-28, 01:43:02
vielleicht solltest du das lieber selber schreiben, als dir einen haufen code zusammenzuklauen und aneinander zu frickeln.
wird natürlich wesentlich länger dauern, aber du lernst was dabei und verstehst am ende vielleicht auch was du getan hast...
Bisher hat mich das "zusammenklauen" aus öffentlichen Tuts, Foren-Hilfen, Büchern und Seminarunterlagen immer dahin gebracht, wo ich hin wollte. Wenn Du das als Diebstahl ansiehst, frage ich mich, bei wem Du alles "geklaut" hast als Du angefangen hast zu programmieren. Oh entschuldige, PHP/JS sind ja Deine Muttersprache, die Dir schon in die Wiege gelegt wurden... :rolleyes:
Vielleicht solltest Du meinem Lernprozess durch hilfreichere Posts auf die Sprünge helfen? Ich brauche dazu Material und keine Belehrungen...
Also: Wie kann ich den Output von xajax_ticker, welcher durch die Funktion RefreshTicker() aktualisiert wird, wie eine (endlos) Laufschrift animieren?
Popopinsel
2009-03-03, 09:10:23
Keiner ne Idee? ;(
Bisher hat mich das "zusammenklauen" aus öffentlichen Tuts, Foren-Hilfen, Büchern und Seminarunterlagen immer dahin gebracht, wo ich hin wollte. Wenn Du das als Diebstahl ansiehst, frage ich mich, bei wem Du alles "geklaut" hast als Du angefangen hast zu programmieren. Oh entschuldige, PHP/JS sind ja Deine Muttersprache, die Dir schon in die Wiege gelegt wurden... :rolleyes:
es geht nicht ums selber schreiben. sondern ums verstehen.
Popopinsel
2009-03-03, 12:20:35
es geht nicht ums selber schreiben. sondern ums verstehen.
Dann hilf mir doch bitte auf die Sprünge! Teil Dein Wissen! :wink:
Scream
2009-03-03, 18:20:07
Dann hilf mir doch bitte auf die Sprünge! Teil Dein Wissen! :wink:
Meinst du sowas in der Art?
http://de.selfhtml.org/html/text/proprietaer.htm#marquee
Wenn nein, dann erklär mir bitte nochmal genauer was du möchtest.
vBulletin®, Copyright ©2000-2024, Jelsoft Enterprises Ltd.