✔ JavaScript über Ajax-Request ausführen

[WindowShopper]

Hi,
ich komme gleich zu meinem Problem:
Ich hab in meiner Datenbank Datensätze mit Text, für jeden Datensatz eine eigene div-Box.
Jetzt möchte ich mit Ajax (verwende prototype.js) und Ajax.Request eine PHP-Datei aufrufen, die mir alle Datensätze aufruft, die einen Text beinhaltet und die Texte über die Datensatz-ID in die entsprechenden divs verteilen (innerHTML).
Wenn ich aber eine PHP-Datei mit Request aufrufe, wird der JavaScript-Code in dieser PHP ja nicht ausgeführt.
Gibt's da irgendwie eine Möglichkeit?

 

[cr4shm4n]

Deine PHP-Datei gibt also Javascript aus, richtig?

In dem Fall bietet Prototype die Möglichkeit, antworten mit den Content-types application/ecmascript, application/javascript, application/x-ecmascript, application/x-javascript, text/ecmascript, text/javascript, text/x-ecmascript, und text/x-javascript
...auszuführen.
Das geschieht über die Option evalJS.
Mehr dazu hier.
Und da.

Ich würde dir allerdings sowieso eher empfehlen, die Daten als JSON an den Client zu senden und mit String#evalJSON in Objekte umzuwandeln. Das verursacht weniger Traffic und ist sicherer.

Ein kleines Beispiel wie die Antwort dann aussehen könnte:

[
  {
    title: "Text1",
    content: "Text1-Content"
  },
  {
    title: "Text2",
    content: "Text2-Content"
  }
]

Für eine Differenzierung zwischen den einzelnen Antworten könntest du einfach ein weiteres Attribut mit einer ID hinzufügen.

 

[WindowShopper]

Ging ja mal echt flott mit der Antwort Dankeschön, soweit hatte ich mich da noch nicht eingearbeitet. Ich les mir jetzt mal die Seiten durch und probier ein bisschen rum und melde mich dann wieder

Hm, diese "Antwort" muss ich dann in der PHP-Datei erstellen oder? Und wie bekomme ich die in die eigentliche Datei mit dem Ajax?

 

[cr4shm4n]

Hm, diese "Antwort" muss ich dann in der PHP-Datei erstellen oder? Und wie bekomme ich die in die eigentliche Datei mit dem Ajax?

Die PHP-Datei gibt die Antwort (Response) wie ganz normalen Text mit echo aus. Man kann sie also im Prinzip als verlängerten Arm deiner Javascript-Anwendung betrachten.
Schrittweise tut sie (mal auf den JSON-Vorschlag bezogen):
a) Daten aus der Datenbank abfragen
b) Diese im JSON-Format in einen String schreiben
c) Den String mit echo o.ä. ausgeben

Auf Clientseite passiert also folgendes:
a) XmlHttpRequest an die PHP-Datei
b) Antwort in ein Objekt umwandeln
c) Die entsprechenden Eigenschaften in die Divs schreiben

Ich glaube, ich habe die Aufgabe damit ausreichend behandelt.

PS: Falls du Zugriff auf deine PHP-Installation hast, gibt es diverse Erweiterungen für die Umwandlung von und nach JSON (ist hier aber eigentlich nur eine Komfort-Funktion und nicht zwingend nötig)

 

[WindowShopper]

Vielleicht ist's einfach nur zu spät heute, aber ich hab glaube ich jetzt nur noch ein Problem mit dem b) Antwort in ein Objekt umwandeln

Also, meine angesprochene PHP sieht zB so aus:

<?
$vari = '[
{"divid": "1", "text": "Text1"},
{"divid": "2", "text": "Text2"},
{"divid": "3", "text": "Text1"}
]';
echo $vari;
?>

Angesprochen mit

var req = new Ajax.Request("text.php");

Aber jetzt? :/

Edit: Ok, hab's jetzt irgendwie hinbekommen :-D Wäre trotzdem interessiert, wie du's gemacht hättest

 

[H3llsing]

Heya, da dieser Topic zu 100% mit meinem Problem übereintrifft will ich kein neuen Thread erstellen

Da ich aber noch so ziemlich ein Anfänger bin, komm ich mit Prototype nicht so ganz zurecht.
Ich gestalte grade eine Internet Seite auf Ajax um, da nicht die gesamte Seite Refresht werden muss sondern nur der Div mit dem Maincontent. Dieses ist schneller und optisch schöner.
Das Problem besteht darin dass der Javascript Code bei Ajax Response Text nicht ausgeführt wird aber ins document geschrieben wird ( genau wie bei window shopper beschrieben ).
Meine Frage wäre also:
Wie konvertiere ich die PHP Datei, die Styles und Javascripte enthält richtig in JSON um ?
Ein kleiner Code schnipsel wie ich es einbinde wäre mir sehr Hilfreich!

Einmal mein Ajax, dass den Response in den MainDiv namens "ajax" schreibt

<script type="text/javascript">
var root="http://"+window.location.hostname

  function getData(url) {
    var req = false
    
    //  Mozilla, Safari etc
    if (window.XMLHttpRequest){
      req = new XMLHttpRequest()
    }
     //  IE
    else if (window.ActiveXObject){
      try {
        req = new ActiveXObject("Msxml2.XMLHTTP")
      } 
      catch (e){
        try{
          req = new ActiveXObject("Microsoft.XMLHTTP")
        }
      catch (e){}
      }
    }
    else
    return false
    req.open('GET', url, false) 
    req.send(null)
    writecontent(req)
 }

function writecontent(req){
  if (window.location.href.indexOf("http")==-1 || req.status==200)
  
  document.getElementById("ajax").innerHTML = req.responseText;
}


</script>

und die angeforderten Dateien sind alle .php
allerdings können diese auch <style type="text/css"> und <script type="text/javascript"> enthalten.