Ajax responseText als HTML behandeln @ tutorials.de: Tutorials, Forum & Hilfe

zer0 · 03.09.10 18:08

Hallo,

ich setze ein XmlHttpRequest ab, und bekomme als responseText die HTML Seite zurück. Das ist auch alles gut so. Nur benötige ich jetzt ein Element aus der Seite vom response. Deswegen will ich mittels getElementById() das Element auswählen, aber der Text von responseText wird anscheinden nicht als HTML behandelt.

Kann ich das irgendwie machen?

Gruß

Sven Mintel · 03.09.10 19:26

Moin,

ja, das kannst du machen.

Sofern die HTML-Source, die du da geliefert bekommst, gültiges XML ist, kannst du per responseXML auf das Dokument-Objekt zugreifen.

zer0 · 03.09.10 20:12

Und im gültiges XML zu bekomme muss ich im HTML beim meta-Tag den MimeType "application/xhtml+xml" angeben oder?

Den wenn ich responseXML benutze bekomme ich nur "null" zurück!

Sven Mintel · 03.09.10 20:19

Nö, um gültiges XML zu bekommen, musst du gültiges XML liefern, es reicht da nicht aus, zu Behaupten, dass es XML ist.

Hier die Grundregeln: http://de.wikipedia.org/wiki/Extensi...sischer_Aufbau

zer0 · 03.09.10 20:24

Aber ich habe doch schon alles gemacht. Mein Dokument ist auch XHTML valide.

Ich habe es mal so probiert, aber geht auch nicht:

HTML-Code:

<?xml version="1.0"?>
<!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>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
...

Sven Mintel · 03.09.10 20:27

Poste doch mal die Source deines Dokumentes, also das, was dort als Antwort ankommt.

zer0 · 03.09.10 20:45

Ich mache folgendes:

Code :

1 2	var response = xmlHttp.responseXML; alert(response);

Und bekomme dann nur null als Ausgabe!

EDIT:

Bin grad über folgendes Thema gestolpert: http://www.tutorials.de/javascript-a...xt-parsen.html

Das ist genau das, was ich auch brauche. Kannst du mir vllt ein Beispiel geben wie du das meinst dort, denn das versteh ich nicht ganz?

Gruß

Sven Mintel · 03.09.10 21:52

Zitat von zer0

Ich mache folgendes:
Das ist genau das, was ich auch brauche. Kannst du mir vllt ein Beispiel geben wie du das meinst dort, denn das versteh ich nicht ganz?

Code :

1 2	var dummy = document.createElement('div'); dummy.innerHTML=xmlHttp.responseText;

dummy ist ein Elementknoten, auf den du alle DOM-Methoden eines soclhe Knoten anwenden kannst.
Da ist aber der Haken: so ein Knoten hat keine Methode getElementById()

bspw. getElementsByTagName() könntest du hingegen darauf anwenden, denn das ist eine Methode von document und Elementknoten

zer0 · 04.09.10 10:35

Okay, danke schön. Inzwischen habe ich es auch geschafft das ich gültiges XML geliefert bekomme. Ich hab nur noch vergessen den richtigen Header in PHP zu senden :P

Jetzt ist die Frage was ich benutze. XML wäre zwar eleganter, nur das Problem ist das andere User Einträge machen können und also nicht valides gültiges XHTML eintragen können.

Damit würde es dann gleich zu verarbeitungsfehlern kommen.
Hmm, was benutz ich jetzt besser?

Sven Mintel · 05.09.10 17:09

Naja, optimal wäre natürlich, wenn du die Benutzereingaben so bearbeitest, dass sie valide sind, bevor sie auf die Welt losgelassen werden.

Es muss ja nicht mal valides XHTML sein, valides XML ist ausreichend, damit responseXML etwas liefert.

scrippi · 06.09.10 21:55

Code :

1 2	var dummy = document.createElement('div'); dummy.innerHTML=xmlHttp.responseText;

das hier kann nur funktionieren, wenn dummy in das Dokument auch integriert wird, zB über appendChild()

zer0 · 07.09.10 10:52

Zitat von scrippi

Code :

1 2	var dummy = document.createElement('div'); dummy.innerHTML=xmlHttp.responseText;

das hier kann nur funktionieren, wenn dummy in das Dokument auch integriert wird, zB über appendChild()

Da irrst du dich, es geht auch so!

scrippi · 07.09.10 11:32

Streite ich nich ab, hatte bei mir jedoch erst immer geklappt als es im document war...

Sven Mintel · 07.09.10 15:41

Hier mal eine Hilfsfunktion, welche ein HTML-Dokument anhand von HTML-Code erstellt und dies zurückliefert:

Code :

<script type="text/javascript">
<!--
function loadHTML(strHTML)
{
  var doc=null;
  if(document.all && !window.opera)//IE
  {
    doc=document.createDocumentFragment();
    doc.appendChild(doc.createElement('root'));
    doc.firstChild.innerHTML=strHTML;
  }
  else
  {
    if(document.implementation)
    {
      if(window.opera || typeof window.mozInnerScreenX!='undefined')//Opera + FF
      {
        doc=document.implementation.createDocument ('http://www.w3.org/1999/xhtml', 'root',  null);
        doc.documentElement.innerHTML=strHTML
      }
      else//chrome+safari
      {
        doc=document.implementation.createDocument ('http://www.w3.org/1999/xhtml', '',  null);
        var root=doc.createElement('root');
                root.innerHTML=strHTML;
                doc.appendChild(root);
      }
    }
  }
  return doc;
} 
//Kurzer test
alert(loadHTML('<b><i id="elementID">Es geht</i></b>').getElementById('elementID').innerHTML);
 
 
//-->
</script>

Der Test zeigt, auch getElementById() ist dort nutzbar.
Getestet in
FF3.6.8
Opera9.5
Win-Safari 5.0.1
Chrome5.0
IE6-8

zer0 · 08.09.10 18:25

Hey,
vielen Dank für den Code. Ich habe es aber jetzt schon anders gelöst und klappt gut.

Aber vllt hat jemand noch eine andere Idee wie ich mein select-Element "tauschen" kann. Ich will grad die ganzen option-Einträge gegen andere tauschen.

Dafür habe ich auch eine Lösung, aber der Interesse halber, vllt hat ja noch jemand eine bessere.

Hier meine Lösung:

Code javascript:

var response = xmlHttp.responseText; // Die ganze HTML Seite als Rückgabe
            
var dummy = document.createElement('div'); // Dummyelement
dummy.innerHTML = response; // HTML Code in das Dummy Element einfügen
            
var selectElements = dummy.getElementsByTagName('select'); // Alle select-Element auswählen
var selectElement = selectElements[0]; // Das erste (und einzige) auswählen
            
var categorys = document.getElementById('category'); // Aus meiner HTML Seite das select-Element mit der ID category auswählen
            
var categorysLength = categorys.length; // Anzahl der aktuellen option-Einträge
var selectElementLength = selectElement.length - 1; // Anzahl der neuen option-Einträge - 1 sodass die Variable auf das letzte Element zeigen kann
            
// Dem select-Element das neue Element hinzufügen 
categorys.options[categorysLength] = selectElement.options[selectElementLength];

Gruß

tut orials.de	tut verbinden	tut dir helfen	tut kooperieren
©2000-2012 tutorials.de Alle Rechte vorbehalten	tut informieren » Impressum » Nutzungsregeln » Netiquette » Team » Redaktion	» Tutorials » Videotutorials » Showroom » Events & Contests » Chat » RSS-Feed » Blogs	» der-webdesigner.net » DesignerInAction » Design Nation » Directorforum » Flashhilfe » PHP-Resource » PHPwelt » PSD-Tutorials

Themen-Optionen

Anzeige

Ähnliche Themen

[AJAX] kein Responsetext -> was mache ich falsch?

Ajax Script macht nur responseText

Ajax ResponseText und alert

[AJAX] responseText parsen

AJAX responseText senden

Stichworte

E-Mail:

Abonnieren Abbestellen