AJAX mit mehreren Variablen

[Rolf]

Hallo,

bisher habe ich AJAX nur angewendet um einzelne Variable zu aktualisieren.
Nun stehe ich vor dem Problem fünf Werte übertragen zu müssen.

• eine Überschrift mit HTML-Tags (je Titel verschieden)
• eine Bild-URL
• die Bildgröße, z.B.: 'width="123" height="234"'
• den Inhalt des alt-Tags
• die Biographie eines Künstlers ca. 3-7kB Text inclusive HTML-Tags
  Man könnte alles in einen String stopfen und den auf der Empfangsseite
  wieder zerpliesern, aber elegant finde ich das nicht.

Hat jemand eventuell ein Beispiel parat, das man sich aufbohren kann?

m.b.G. Rolf

[FraFu]

Hallo!

Hat jemand eventuell ein Beispiel parat, das man sich aufbohren kann?

Beispiel hab ich auf die Schnelle nicht zur Hand. Ich verwende meist JSON Notation um Daten zu übertragen. Hat nicht soviel Overhead wie XML.
Also Anfrage an Webserver - der liefert eine Datenstruktur in JSON, die nimmst du aus dem Response und liest aus dem Objekt aus was du haben möchtest. Bzw sollte der Server nur liefern was du haben möchtest.

mfg
  frafu

[Ale×]

Hallo Rolf,

wenn Du tatsächlich AJA_X_ verwendest, bekommst Du doch Daten in XML-Form. Da kannst Du doch so viele Variablen wie Du willst übertragen:

<data>  
<title>foo</title>  
<content>bar</content>  
<sonstwas>sonstwas</sonstwas>  
<nochwas>nochwas</nochwas>  
</data>

Ale×

[Rolf]

Hallo Ale×,

wenn Du tatsächlich AJA_X_ verwendest,
bekommst Du doch Daten in XML-Form.
Da kannst Du doch so viele Variablen wie Du willst übertragen:

stimmt irgendwie:

<data>  
<titel>Galerie Depelmann</titel>  
<uhrzeit>jetzt</uhrzeit>  
<server>Depelmann.de</server>';  
<bild>http://depelmann.de/galimg/galerie3.jpg</bild>';  
<text>Unser Haus stattet nach Ihren Wünschen Büro- und Geschäftsräume aus.</text>  
</data>

Das steht jetzt so in "xmlhttp.responseText".
Und wie bekommt man das zerlegt, also in einzelne Variable?

m.b.G. Rolf

[Ale×]

Hallo Rolf,

Und wie bekommt man das zerlegt, also in einzelne Variable?

So z.B.:
var uhrzeit = xml.getElementsByTagName('uhrzeit')[0].firstChild.data;

Vielleicht helfen Dir diese Beispiele weiter, die habe ich mal zur Einarbeitung gemacht: http://www.mylittlehomepage.net/ajax-tutorial-datenabfrage

Ale×

[Rolf]

Hallo Ale×,

Vielleicht helfen Dir diese Beispiele weiter, die habe ich mal zur
Einarbeitung gemacht: http://www.mylittlehomepage.net/ajax-tutorial-datenabfrage

nicht wirklich,
XML mit PHP ist kein Problem, aber ich muss es ja mit JavaScript packen!
Hier mal ein Ausschnitt:

if (xmlHTTP.readyState == 4 && xmlHTTP.status == 200) {  
    alert(xmlHTTP.responseText);   /*--------------- es kommt alles als XML an */  
    $('eg0').innerHTML = xmlHTTP.responseText;  /*-- hier Text ohne Tags */  
    $('eg1').innerHTML = xmlHTTP.getElementsByTagName('titel')[0].firstChild.data  /*-- Error */  
}

Error:  Das Objekt unterstützt diese Eigenschaft oder Methode nicht.

Was nun großer Meister ...

m.b.G. Rolf

[Rudgar]

$begruessung

Was nun großer Meister ...

xmlHTTP.responseXML verwenden anstatt
xmlHTTP.responseText.

Gruß, Ich

[Rolf]

Hallo Rudgar,

Was nun großer Meister ...
xmlHTTP.responseXML verwenden anstatt
xmlHTTP.responseText.

danke,
nun habe ich in SELFHTML nach diesem xmlHTTP-Objekt gesucht um auch selbst
etwas zu finden, aber leider gab es da nix. Hast Du vielleicht eine URL
zu der Objektbeschreibung?

m.b.G. Rolf

[ChrisB]

Hi,

nun habe ich in SELFHTML nach diesem xmlHTTP-Objekt gesucht um auch selbst
etwas zu finden, aber leider gab es da nix. Hast Du vielleicht eine URL
zu der Objektbeschreibung?

http://de.wikipedia.org/wiki/XMLHttpRequest listet unter Quellen relevante Dokus auf.

MfG ChrisB

[Rolf]

Hallo Cris,

http://de.wikipedia.org/wiki/XMLHttpRequest listet unter Quellen relevante Dokus auf.

im Prinzip ja - aber:
eine ordentliche Objektbeschreibung ist nicht dabei.
Vor allem fehlt eine vollständige Liste der implementierten Methoden.

m.b.G. Rolf

[Struppi]

http://de.wikipedia.org/wiki/XMLHttpRequest listet unter Quellen relevante Dokus auf.
im Prinzip ja - aber:
eine ordentliche Objektbeschreibung ist nicht dabei.
Vor allem fehlt eine vollständige Liste der implementierten Methoden.

Du hast den Satz von Chris gelesen? Und vor allem verstanden?

Struppi.

[Rolf]

http://de.wikipedia.org/wiki/XMLHttpRequest listet unter Quellen relevante Dokus auf.
im Prinzip ja - aber:
eine ordentliche Objektbeschreibung ist nicht dabei.
Vor allem fehlt eine vollständige Liste der implementierten Methoden.
Du hast den Satz von Chris gelesen? Und vor allem verstanden?

hmm,
wenn Du der berechtigten Annahme bist, dass ich es nicht verstanden habe,
erwarte ich untertänigst Deine Belehrung, oh Herr.
Nur zu posten, dass ich doof bin, ist sinnfreie Zeitverschwendung!
Heisst soviel, dass ich Deinen Beitrag auch nicht verstanden habe ... :-(

m.b.G. Rolf

[Struppi]

http://de.wikipedia.org/wiki/XMLHttpRequest listet unter Quellen relevante Dokus auf.
im Prinzip ja - aber:
eine ordentliche Objektbeschreibung ist nicht dabei.
Vor allem fehlt eine vollständige Liste der implementierten Methoden.
Du hast den Satz von Chris gelesen? Und vor allem verstanden?
hmm,
wenn Du der berechtigten Annahme bist, dass ich es nicht verstanden habe,
erwarte ich untertänigst Deine Belehrung, oh Herr.
Nur zu posten, dass ich doof bin, ist sinnfreie Zeitverschwendung!
Heisst soviel, dass ich Deinen Beitrag auch nicht verstanden habe ... :-(

Auf der wikipedia Seite werden eine Reihe von Quellen mit relevanten Informationen aufgelistet. Was ist daran nicht zu verstehen? Warum hast du dir die Quellen nicht angeschaut? Oder andersrum was ist dir daran nicht "ordentlich" genug?

Struppi.

[Rolf]

Oder andersrum was ist dir daran nicht "ordentlich" genug?

z.B. dass es keinerlei Bezug zum Thema dieses Threads gibt.

Wobei es durchaus möglich ist, dass die Vereinzelung nicht zum Leistungsumfang gehört.
Dann dient das "xml" im Namen jedoch nur zur Irreführung ... :-(

m.b.G. Rolf

[Struppi]

Oder andersrum was ist dir daran nicht "ordentlich" genug?
z.B. dass es keinerlei Bezug zum Thema dieses Threads gibt.

Du redest irgendwie Unsinn, deine Frage war:

eine ordentliche Objektbeschreibung ist nicht dabei.
Vor allem fehlt eine vollständige Liste der implementierten Methoden.

Genau das beinhalten die Quellen die bei Wikipedia gelistet sind.

Dann dient das "xml" im Namen jedoch nur zur Irreführung ... :-(

Was immer das nun wieder heißen mag.

Struppi.

[molily]

Wobei es durchaus möglich ist, dass die Vereinzelung nicht zum Leistungsumfang gehört.

Was bedeutet dieser Satz? Ich verstehe ihn nicht.

Dann dient das "xml" im Namen jedoch nur zur Irreführung ... :-(

Mit »XMLHttpRequest« kannst du XML-Dateien laden und auf das XML-Dokument mithilfe des DOM zugreifen - musst es aber nicht. Du kannst verschiedene HTTP-Anfragen absenden und kannst auf die Serverantwort auch als Text zugreifen. Damit bist du nicht an XML/DOM gebunden.

Mathias

[Rolf]

Wobei es durchaus möglich ist, dass die Vereinzelung nicht zum Leistungsumfang gehört.
Was bedeutet dieser Satz? Ich verstehe ihn nicht.

die XML-Daten kommen im Browser an, und damit ist der Service beendet.
z.B.:
var data = xmlHTTP.responseXML; /* erzeugt das Object "data" */
iterieren über diese Objekt ist jedoch verboten
und getElementsByTagName ist auch keine zulässige Methode.
D.h. man(ich) kommt an die Daten nicht ran und eine Lösung ist nicht in Sicht.

m.b.G. Rolf

[Struppi]

Wobei es durchaus möglich ist, dass die Vereinzelung nicht zum Leistungsumfang gehört.
Was bedeutet dieser Satz? Ich verstehe ihn nicht.
die XML-Daten kommen im Browser an, und damit ist der Service beendet.
z.B.:
var data = xmlHTTP.responseXML; /* erzeugt das Object "data" */
iterieren über diese Objekt ist jedoch verboten

Wie kommst du darauf?

und getElementsByTagName ist auch keine zulässige Methode.

Wo steht das?

Struppi.

[Rolf]

iterieren über diese Objekt ist jedoch verboten
Wie kommst du darauf?
und getElementsByTagName ist auch keine zulässige Methode.
Wo steht das?

in der Fehlerconsole vom FF bzw. im Error-Fensterchen des IE
Wieso fragst Du, kennst Du die nicht?

m.b.G. Rolf

[ChrisB]

Hi,

iterieren über diese Objekt ist jedoch verboten
Wie kommst du darauf?
und getElementsByTagName ist auch keine zulässige Methode.
Wo steht das?
in der Fehlerconsole vom FF bzw. im Error-Fensterchen des IE
Wieso fragst Du, kennst Du die nicht?

Nein, er kann nur nicht ahnen, wie ungeschickt du dich anstellst.

MfG ChrisB

[Struppi]

iterieren über diese Objekt ist jedoch verboten
Wie kommst du darauf?
und getElementsByTagName ist auch keine zulässige Methode.
Wo steht das?
in der Fehlerconsole vom FF bzw. im Error-Fensterchen des IE
Wieso fragst Du, kennst Du die nicht?

Doch ich kenne die, aber bei mir gibt es keine Fehler. Ich kann ohne Probleme auf das XML Dokument mit getElementsByTagName zugreifen. D.h. du machst irgendetwas anderes falsch, nur was?

Struppi.

[Rolf]

D.h. du machst irgendetwas anderes falsch, ...

richtig!

... nur was?

um das heraus zu finden habe ich diesen Thread gestartet, und
weil ich mir meiner bescheidenen Fähigkeiten durchaus bewusst bin.

Noch einmal zur Info:
URL zum xmlHTTPRequest mit Übertragung text/html
URL zum xmlHTTPRequest mit Übertragung application/xml

Im XML-Zweig habe ich nach den von Mathias vorgeschlagenen Abfragen noch
ein var text = xmlHTTP.responseText; alert(text); eingefügt, so dass
wenigstens zu erkennen ist, dass die Daten angekommen sind.

m.b.G. Rolf

[Struppi]

URL zum xmlHTTPRequest mit Übertragung application/xml

Und hier kannst du nicht auf xmlHTTP.responseXML.getElementsByTagName() zugreifen?

Struppi.

[Rolf]

URL zum xmlHTTPRequest mit Übertragung application/xml
Und hier kannst du nicht auf xmlHTTP.responseXML.getElementsByTagName() zugreifen?

wenn ich das so geschrieben habe, wird es stimmen, ich bin kein Dichter.
Das macht ja auch Sinn, ohne (IE)Object keine (IE)Methoden.

m.b.G. Rolf

[molily]

Es ist übrigens echt sehr schwierig, mit dir zu kommunizieren, du sprichst oftmals in Rätseln und man weiß nicht, was du einem sagen bzw. ob du etwas fragen willst. Falls es klappt, sage doch einfach »Danke, nachdem ich den Content-Type auf application/xml geändert habe, funktioniert es auch im IE«.

Mathias

[Struppi]

URL zum xmlHTTPRequest mit Übertragung application/xml
Und hier kannst du nicht auf xmlHTTP.responseXML.getElementsByTagName() zugreifen?
wenn ich das so geschrieben habe, wird es stimmen, ich bin kein Dichter.
Das macht ja auch Sinn, ohne (IE)Object keine (IE)Methoden.

Weißte Uwe (war das nicht dein Name im Spotlight Forum?), deine völlig unkonstruktive Art und Weise, die du an den Tag legst, wenn man dir bei deinen Problemen helfen möchte, ist nervig und frustrierend. Wir hatten ja schon ein paar mal das Problem miteinander. Es wäre daher schön, wenn du in Zukunft mit (d)einem Namen deine Fragen stellst, dann kann ich diese ausblenden und muss mich nicht mit dir rumärgern.

Das ist zwar schade, denn die Probleme die du mit JS hast, sind interessant und ich würde dir gerne helfen, aber immer wieder nur Bruchstücke von dir zu sehen und dir mühsam Infos aus der Nase zu ziehen, macht definitiv keinen Spaß mehr.

Trotzdem wünsche ich dir weiterhin viel Spaß mit JS und in diesem Forum, ich werde die Rolf Threads nun einfach ausblenden.

Struppi.

[molily]

var data = xmlHTTP.responseXML; /* erzeugt das Object "data" */

alert(data + "\n" + typeof data);
alert(data.documentElement);

Wenn das nichts bzw. undefined/null/false usw. ausgibt, dann hat der Browser die Serverantwort nicht als XML verarbeitet. Das kann verschiedene Ursachen haben.

Der Server sollte das XML-Dokument mit dem MIME-Typ application/xml senden. Außerdem muss das XML-Dokument wohlgeformt sein, also validiere es einmal. In der Firefox-Fehlerkonsole werden XML-Fehler angezeigt, also schaue einmal dort.

Wenn diese Voraussetzungen gegeben sind, steht unter responseXML das DOM-Document-Objekt zur Verfügung - ansonsten halt nicht.

iterieren über diese Objekt ist jedoch verboten

Verboten sicher nicht, höchstwahrscheinlich einfach nicht möglich, weil responseXML in deinem Fall kein Objekt ist.

und getElementsByTagName ist auch keine zulässige Methode.

Siehe oben.

Mathias

[Rolf]

Hallo,

  
     var data = xmlHTTP.responseXML;  
     alert('1.\t' + data);  
     alert('2.\t' + typeof data);  
     alert('3.\t' + data.documentElement);  

erzeugt im FF:
1.   [object XML.Document]
2.    object
3.   [object Element]
und die Fehlerconsole bleibt Muttiweiss.
Kann man auch http://uris.de/test/ajax/ajax.html?9 testen.

Im IE passiert dieses:
1.
2.   object
3.   null
da die Übertragung von text/html super klappt und der Code aus
WikiPedia stammt, stehe ich etwas im Wald ... :-(

Übrigens:
Ruft man http://uris.de/test/ajax/ajax.html auf, erfolgt eine
reine Textübertragung, die in beiden Browser funktioniert.

m.b.G. Rolf

[Struppi]

Ruft man http://uris.de/test/ajax/ajax.html auf, erfolgt eine
reine Textübertragung, die in beiden Browser funktioniert.

Die Antwort des Servers ist bei dir immer text/html, d.h. du hast die Antwort von Mathias nicht verstanden. Wenn du xml nutzen möchtest, muss der Server auch eine entsprechende Antwort senden.

Struppi.

[ChrisB]

Hi,

http://de.wikipedia.org/wiki/XMLHttpRequest listet unter Quellen relevante Dokus auf.
im Prinzip ja - aber:
eine ordentliche Objektbeschreibung ist nicht dabei.
Vor allem fehlt eine vollständige Liste der implementierten Methoden.

D'oh!
Da ist bspw. http://developer.mozilla.org/en/XMLHttpRequest verlinkt.

Nur zu posten, dass ich doof bin, ist sinnfreie Zeitverschwendung!

Nach dem Motto "Don't state the obvious" ...?

MfG ChrisB

[molily]

eine ordentliche Objektbeschreibung ist nicht dabei.
Vor allem fehlt eine vollständige Liste der implementierten Methoden.

Welchen Bezug hat deine Frage zum Thema des Threads?

Mathias

[molily]

bisher habe ich AJAX nur angewendet um einzelne Variable zu aktualisieren.
Nun stehe ich vor dem Problem fünf Werte übertragen zu müssen.

Alternativ zu XML könntest du JSON als Übertragungsformat nutzen. Darauf kannst du im JavaScript einfacher zugreifen.

Serverseitig gibst du einen Object-Literal aus:

{
   url : "...",
   width : 123,
   height : 456,
   alt : "...",
   bio : "..."
}

Bei der Biographie musst du bei HTML natürlich auf korrektes Escaping der doppelten Anführungszeichen achten.

Im JavaScript nimmst du die Serverausgabe aus responseText und führst den diesen JavaScript-Code mittels eval() aus. Zurückgeliefert wird dir ein JavaScript-Object:

var object = eval(xmlhttprequest.responeText);

(xmlhttprequest ist dein XMLHttpRequest-Objekt.)

Dann kannst du auf die Daten einfach so zugreifen:

object.url
object.width
usw.

Mathias