J
Jule1988
New member
- Beiträge
- 1
- Punkte Reaktionen
- 0
Hallo ich lese verschiedene Daten aus der IndexeDB mittels Cursor aus. Das funktioniert soweit . Das Ergebnis soll am Ende in einer Tabelle dargestellt werden.
Mein Plan war ein TR Element aus verschiedenen Werten zu erstellen (Funktioniert auch) und dieses TR dann mittels appendChild in die Tabelle zu fügen.
Und an dieser Stelle wirft es den Fehler "Cannot read property 'appendChild' of null".
Ergänzung: Mittlerweile habe ich in einem anderen Forum das Problem zumindest verstehen können, es hat etwas damit zu tun das die Variablen nicht rechtzeitig geladen werden. Wenn ich nur den reinen Tabellenteil nachbaue, ohne IndexedDB, dann kann ich das Problem lösen, indem ich ein window.onload = function () { voran stelle. In dem IndexedDB Konstrukt gelingt mir das nicht, weil ich hoffen gestanden da auch wenig Verständnis habe wo genau es dann hin muss und ob es in dem Kontext überhaupt gehen kann.
Anbei der Code, ich hoffe ihr versteht was ich meine und jemand sieht das Problem. (Ich bin blutige Anfängerin..in Sachen Programmierung und Forennutzung, also seht mir eventuelle Fettnäpfchen nach)
Das ist die Testtabelle in die es rein soll:
Das meine Funktion in der JS Datei
Und die Fehlermeldung in den Entwicklertools:
oben lasse ich das TR Element testweise anzeigen, es enthält die Testinhalte aus der IndexedDB nur wollen sie nicht in die Tabelle rein.

Mein Plan war ein TR Element aus verschiedenen Werten zu erstellen (Funktioniert auch) und dieses TR dann mittels appendChild in die Tabelle zu fügen.
Und an dieser Stelle wirft es den Fehler "Cannot read property 'appendChild' of null".
Ergänzung: Mittlerweile habe ich in einem anderen Forum das Problem zumindest verstehen können, es hat etwas damit zu tun das die Variablen nicht rechtzeitig geladen werden. Wenn ich nur den reinen Tabellenteil nachbaue, ohne IndexedDB, dann kann ich das Problem lösen, indem ich ein window.onload = function () { voran stelle. In dem IndexedDB Konstrukt gelingt mir das nicht, weil ich hoffen gestanden da auch wenig Verständnis habe wo genau es dann hin muss und ob es in dem Kontext überhaupt gehen kann.
Anbei der Code, ich hoffe ihr versteht was ich meine und jemand sieht das Problem. (Ich bin blutige Anfängerin..in Sachen Programmierung und Forennutzung, also seht mir eventuelle Fettnäpfchen nach)
Das ist die Testtabelle in die es rein soll:
<table id="eventTable">
<thead>
<tr>
<th>key</th>
<th>evBez</th>
<th>kurzBesch</th>
</tr>
</thead>
<tbody id="eventTableBody">
</tbody>
<tfoot></tfoot>
</table>
Das meine Funktion in der JS Datei
function showAll() {
var dbRequest = indexedDB.open('EventDB', 1);
dbRequest.onsuccess = function (event) {
console.log('DB is successfully opened von showAll()');
var db = event.target.result;
// Transaktion erstellen
var transaction = db.transaction('events', 'readonly');
var store = transaction.objectStore('events');
store.openCursor().onsuccess = function (event) {
var cursor = event.target.result;
if (cursor) {
var newRow = document.createElement('tr');
var listItem = document.createElement('td');
var listItem2 = document.createElement('td');
var listItem3 = document.createElement('td');
listItem.innerHTML = cursor.key
listItem2.innerHTML = cursor.value.evBez;
listItem3.innerHTML = cursor.value.kurzB;
newRow.appendChild(listItem);
newRow.appendChild(listItem2);
newRow.appendChild(listItem3);
console.log(newRow);
document.getElementById("eventTableBody").appendChild(newRow);
cursor.continue();
} else {
console.log("Keine Einträge mehr vorhanden");
}
}
Und die Fehlermeldung in den Entwicklertools:
oben lasse ich das TR Element testweise anzeigen, es enthält die Testinhalte aus der IndexedDB nur wollen sie nicht in die Tabelle rein.

Zuletzt bearbeitet: