stehe wieder auf dem Schlauch...

PH

PH

Legendäres Mitglied
Also, ich probiere eine Chat-Einladung zu programmieren, die auch funktioniert, ohne dass der User die Seite aktualisiert.


Auf der Hauptseite, habe ich ein unsichtbares iframe eingebaut.
Das iframe ruft ein php-skript auf, dass sich alle 5 sekunden automatisch aktualisiert und eine Datenbankabfrage macht.

Jetzt... wenn das Skript das vorhandensein einer Einladung feststellt...
wie kann ich damit auf der Hauptseite ein Layer-DIV für den User öffnen?
 
Normalerweise gar nicht.

Der Seitencode im iFrame kann nicht auf das Hauptfenster und umgekehrt zugreifen.

Stichwort Sicherheit.

Es könnte allerdings sein, daß das geht, wenn beides von derselben Domain kommt (was ja hier der Fall ist).

Ich würde das Problem anders lösen: Nur eine Seite, diese startet ein JavaScript. Das überprüft per HttpRequest, ob ein bestimmter Seiteninhalt oder ein passendes Xml-Dokument zurückgegeben wird. Falls nein, ruft es sich selbst per Timer in 5 Sekunden erneut auf. Falls ja, zeigt es das DIV an.


Damit sind alle Probleme, die aus zwei Fenstern entstehen, vermieden.
 
gute Idee, danke Jürgen!

Bin leider in JS nicht so bewandt.
Mal sehen, wie ich weiterkomme... ich müsste eigentlich ein fopen machen, aber das ist ja PHP.

 
QUOTE (PH @ Fr 12.03.2010, 22:47)Bin leider in JS nicht so bewandt.
Mal sehen, wie ich weiterkomme... ich müsste eigentlich ein fopen machen, aber das ist ja PHP.

Ich auch nicht :)

Gehe mal auf

http://beispiel.server-daten.de/chat.html

und sieh in den Quellcode. Solche Zugriffe sind sehr banal, ich war damals selbst überrascht, wie schnell das geht.

Oder direkt:

http://beispiel.server-daten.de/admin/sd.chat.js

Den Codeschnipsel findet man auch so gut wie überall - ist nichts geheimnisvolles.


Im Prinzip genügt es, wenn das angesprochene Script nur eine 'Datei' ausgibt, in der 0 oder 1 drinsteht. Oder eben mehr - dann muß mehr zerlegt werden. Aber das Ergebnis kann ja auch bsp. tabulatorgetrennt übergeben und dann im JavaScript mit irgendetwas wie Split zerlegt werden.
 
naja, die ausgegebenen informationen wären eher ein 2-dim. array... geht alles irgendwie.

das sichten des Code hat mir wieder vergegenwärtigt wie sehr ich JS hasse.

aber wo ich durch muss, da muss ich wohl durch...


oje - ich denke gerade daran, dass bei jeder Einladung der User die Möglichkeiten Accept - Reject und Ignore hat...
Reject und Ignore müssten dann noch MySQL-Queries auslösen...

:-((


das ist AJAX Hardcore.
Verflixte Popup-Blocker!!
 
Da ist ja einiges Server-Daten - typisch: Der JavaScript - Code ist so, daß oben zwei Abfragenamen definiert werden, die dann über

http://beispiel.server-daten.de/queries/q_...t_rows/data.xml

und

http://beispiel.server-daten.de/queries/q_...t_rows/data.xml

ausgeführt werden.

Der erste Eintrag liefert die Zahl der Zeilen zurück. Ändert sich dieser Wert, wird die zweite Seite (= Abfrage) ausgeführt.


Das ist ja eine zusätzliche Abstraktionsschicht, die Du nicht benötigst. Hier dient das dazu, daß mit demselben JavaScript unterschiedliche Kunden bei minimalem Implementierungsaufwand bedient werden können.

Und als Rückgabedatei kannst Du auch direkt den Html-Code zusammenbauen, anstatt wie hier, über eine Xml-Abstraktionsschicht zu gehen.
 
Stimmt, ich könnte über PHP komfortabel den ganzen HTML/JS code für das DIV zurückgeben...

Danke für die Tips, Jürgen.

Die Geschichte wird mir trotzdem einiges an Kopfschmerzen bereiten.

Muss mich wohl ins JS reinknien und das ganze gaanz langsam Schritt für Schritt aufbauen.
Das kann ja lustig werden !

JS hat auf mich immer den eindruck gemacht, als sei es für die Streber erfunden worden, die in der Schule immer alles auswendig gelernt haben.

Ich werde wohl gleich morgen früh eine Packung Panadol einkaufen.
 
Habe schon Mal angefangen...

Erstes Problem: der Popup-Blocker blockt das DIV-Layer, wenn ich es so aufrufe:

CODE
<div id="modal" style="border:3px solid black; background-color:#9999ff; padding:25px; font-size:150%; text-align:center; display:none;">
This is a modal popup!<br><br>
<input type="button" value="OK" onClick="Popup.hide(\'modal\')">
</div>
<script language="JavaScript" type="text/javascript">
<!--
Popup.showModal(\'modal\');
return false;
//-->
</script>';



mouseover oder onclick auf ein Link funktionieren.

Ideen?
 
QUOTE (PH @ Sa 13.03.2010, 00:39)Erstes Problem: der Popup-Blocker blockt das DIV-Layer, wenn ich es so aufrufe:

Ich löse das inzwischen ganz einfach und radikal (da es Nutzer geben kann, die das gar nicht wissen):


QUOTE var d = window.open("", dest, par);

if (!d) { alert('Ihr Popup-Blocker scheint aktiv zu sein. Bitte lassen Sie PopUps für diese Domain zu');
return; }
d.focus();


Wenn bsp. ein Hilfetext angezeigt werden soll oder Details zu einer Listendarstellung gewünscht sind, das aus verschiedensten Gründen aber in einem eigenen Fenster erscheinen soll.
 
Geil - ich hab's gerade zum funktionieren gebracht trotz popup-blocker.
Ich war nur zu blöd, JS richtig zu programmieren :)
Durch Mimetismus zu Jürgen's Alert Skript funktioniert das jetzt.
Ich habe zwar keinen Schimmer warum CODE var d = Popup.showModal(\'modal\');
funktioniert und
CODE Popup.showModal(\'modal\');
alleine nicht, aber egal... :)


QUOTE print '
<div id="modal" style="border:3px solid black; background-color:#9999ff; padding:25px; font-size:150%; text-align:center; display:none;">
This is a modal popup!<br><br>
<input type="button" value="OK" onClick="Popup.hide(\'modal\')">
</div>
<script language="JavaScript" type="text/javascript">
<!--
var d = Popup.showModal(\'modal\');
//-->
</script>';

(das JS wird über PHP ausgegeben)

da erübrigt sich auch der Alert.

also, ich fummele Mal weiter an dem Code rum... vielleicht kommt ja doch was brauchbares raus.

Soo... wie kann ich jetzt das DIV mit der Ausgabe eines PHP Skripts füllen?
 
Problem !!

Folgendes funktioniert nicht:

CODE
print '
<div id="modal" style="border:3px solid black; background-color:#9999ff; padding:25px; font-size:150%; text-align:center; display:none;">
This is a modal popup!<br><br>
<input type="button" value="OK" onClick="Popup.hide(\'modal\')">
</div>
<script language="JavaScript" type="text/javascript">
<!--
var xmlhttp;

function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
 {
 // code for IE7+, Firefox, Chrome, Opera, Safari
 return new XMLHttpRequest();
 }
if (window.ActiveXObject)
 {
 // code for IE6, IE5
 return new ActiveXObject("Microsoft.XMLHTTP");
 }
return null;
}

xmlhttp=GetXmlHttpObject();

var url="modal_test.php";
xmlhttp.open("GET",url,true);
xmlhttp.send(null);

document.getElementById("modal").innerHTML=xmlhttp.responseText;
var d = Popup.showModal("modal");
//-->
</script>';



es wird ein modal popup angezeigt, aber kein Inhalt!
 
Juhuuu...

folgendes funktioniert:

CODE print '
<div id="modal" style="border:3px solid black; background-color:#9999ff; padding:25px; font-size:150%; text-align:center; display:none;">
This is a modal popup!<br><br>
<input type="button" value="OK" onClick="Popup.hide(\'modal\')">
</div>
<script language="JavaScript" type="text/javascript">
<!--
var xmlhttp;

function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject("Microsoft.XMLHTTP");
}
return null;
}

function stateChanged()
{
if (xmlhttp.readyState==4)
{
document.getElementById("modal").innerHTML=url+"<br><br>"+xmlhttp.responseText;
}
}

xmlhttp=GetXmlHttpObject();

var url="modal_test.php";
url=url+"?sid="+Math.random();
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);

var d = Popup.showModal("modal");
//-->
</script>';



soo.... jetzt nur noch Timer einbauen...
 
Ich würde dir dafür die Nutzung von jQuery empfehlen...damit hast du nur einen Bruchteil an Code selbst zu schreiben und musst dir um vieles (Browserkompatibilität) keine Gedanken machen.

Ebenso kannst du damit sehr bequem mit Antworten im JSON-Format umgehen.

http://jquery.com/

Heutzutage muss man solchen Grundlagen-Code nicht mehr selbst schreiben und sich mit Kleinigkeiten rumärgern. Dafür gibts Frameworks. So zumindest meine Meinung...

Grüße
Oli
 
Tschau Oliver

Ja, Jquery benutze ich schon für google maps, aber für das was ich hier machen will, wäre Jquery overkill.
Der kleine code in meinem letzten Post erledigt ja bereits alles was ich brauche!
 
soo... folgendes funktioniert tadellos auf FF, aber leider nicht bei IE.

Beim IE ändert sich die SID irgendwie nicht von einem request auf den anderen, obwohl das script wie gewünscht alle 5 secs ausgeführt wird.
Es scheint sich irgendwie um einen JS-cache zu handeln ??

CODE print '
<div id="modal" style="border:3px solid black; background-color:#9999ff; padding:25px; font-size:150%; text-align:center; display:none;">
This is a modal popup!<br><br>
<input type="button" value="OK" onClick="Popup.hide(\'modal\')">
</div>
<script language="JavaScript" type="text/javascript">
<!--
var xmlhttp;

function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
 {
 // code for IE7+, Firefox, Chrome, Opera, Safari
 return new XMLHttpRequest();
 }
if (window.ActiveXObject)
 {
 // code for IE6, IE5
 return new ActiveXObject("Microsoft.XMLHTTP");
 }
return null;
}

function stateChanged()
{
if (xmlhttp.readyState==4)
{
document.getElementById("modal").innerHTML=url+"<br><br>"+xmlhttp.responseText;
}
}

xmlhttp=GetXmlHttpObject();
var url="modal_test.php";
url=url+"?sid="+Math.random();
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);

function doSomething()
{
url="modal_test.php";
url=url+"?sid="+Math.random();
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
var e = Popup.hide(\'modal\');
var d = Popup.showModal("modal",null,null,{\'screenColor\':\'#99ff99\',\'screenOpacity\':.6});
}

setInterval("doSomething()", 5000);
//-->
</script>';
 
soo...

das hier funktioniert jetzt einwandfrei auf FF und IE

CODE print '
<div id="modal" style="border:3px solid black; background-color:#9999ff; padding:25px; font-size:150%; text-align:center; display:none;">
This is a modal popup!<br><br>
<input type="button" value="OK" onClick="Popup.hide(\'modal\')">
</div>
<script language="JavaScript" type="text/javascript">
<!--
var xmlhttp;
var url;
var e;
var d;

function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject("Microsoft.XMLHTTP");
}
return null;
}

function stateChanged()
{
if (xmlhttp.readyState==4)
{
document.getElementById("modal").innerHTML=url+"<br><br>"+xmlhttp.responseText;
}
}

function doSomething()
{
xmlhttp=GetXmlHttpObject();
url = "modal_test.php" + "?sid=" + Math.random();
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
e = Popup.hide(\'modal\');
d = Popup.showModal(\'modal\',null,null,{\'screenColor\':\'#99ff99\',\'screenOpacity\':.6});
url = "";
}

setInterval("doSomething()", 5000);
//-->
</script>';
 
so, mit ein Paar kleinen zusätzlichen Änderungen funtioniert das jetzt sehr sehr gut.

vielen Dank an Jürgen für die Tips, die mich zur optimalen Lösung geführt haben!
 
Sie müssen sich einloggen oder registrieren, um hier antworten zu können.
Zurück
Oben