Anzeigen einer Tabelle in HTML mit Ajax

Ajax arbeitet mit HTML-Tabellen und XML-Daten, um eine Liste der Datensätze für Ihre Web-Reader anzuzeigen. Anstatt jedes HTML-Element zu definieren, können Sie mit Ajax Tabellenfunktionen aufrufen, um Datensätze in Zeilen und Spalten anzuzeigen, ohne den Code für die Tabellenelemente schreiben zu müssen. Ajax durchläuft jedes Datenelement in XML, und Sie können auswählen, ob die Daten angezeigt oder ausgeblendet werden sollen.

1

Klicken Sie mit der rechten Maustaste auf die HTML- oder Ajax-Datei, die Sie zum Anzeigen der Tabelle verwenden möchten. Öffnen Sie die XML-Datei, die Sie zum Abrufen der Daten für die Tabelle verwenden möchten. Die folgende Ajax-Anweisung öffnet eine XML-Datei mit einer Liste von Kunden:

new Ajax.Request ('customers.xml', {Methode: 'get', onSuccess: Funktion (Transport)}

2

Rufen Sie eine Liste mit Tags und deren Daten ab. Der folgende Ajax-Code lädt die Daten, die Sie zum Durchlaufen verwenden, und erstellt die Tabelle:

var customers = transport.responseXML.getElementsByTagName ('customer');

3.

Erstellen Sie die "for" -Schleife, die jedes XML-Element durchläuft. Der folgende Code zeigt, wie Sie eine "for" -Schleife in Ajax einrichten:

for (var i = 0; i <customers.length; i ++) {}

4

Erstellen Sie eine Tabellenzeile und eine Zelle, um Ihre Daten anzuzeigen. Mit dem folgenden Code werden die Zeilen- und Zellenvariablen erstellt, die die Tabellenstruktur festlegen:

var row = $ ('customers'). insertRow (-1); var cell = row.insertCell (-1);

5

Fügen Sie die Daten der Tabellenzelle hinzu. Der folgende Code fügt der Zelle den Kundennamen hinzu:

cell.innerHTML = Kunde;

Beliebte Beiträge