Web SQL - Eintrag anhand einer Information löschen

html.de-Forum JavaScript
1

Hallo Freunde, folgendes habe ich bis jetzt nicht hingekriegt:

Ich habe eine Webseite erstellt, auf der Man Bilder anzeigen lassen kann. Die Bildpfade sind in einer WebSQL-Datenbank gespeichert. Bei einem Klick auf ein Bild sollen das Bild und der dazugehörige Datenbankeintrag gelöscht werden. Wie realisiere ich dieses Vorhaben?

Hier meine Quelltexte:

index.html

[CODE]

Datenbanken - Übung



Datenbank erstellen
Datenbank löschen

    <input id=name>
    <button onclick="eintrag_erstellen()">Eintrag erstellen</button>
    <hr>
    
    <button onclick="eintraege_anzeigen()">Einträge anzeigen</button>
    <h1>Alle Einträge</h1>
    <div id="anzeige">
    </div>   
</body>
[/CODE]

index.js

[CODE]var datenbank = openDatabase(‚Datenbank‘, ‚1.0‘, ‚Test DB‘, 2 * 1024 * 1024);

function erstelle_datenbank()
{
datenbank.transaction(function (tx)
{
tx.executeSql(‚CREATE TABLE IF NOT EXISTS bilder (pfad TEXT)‘);
});
}

function loesche_tabelle()
{
datenbank.transaction(function (tx)
{
tx.executeSql(‚DROP TABLE bilder‘);
});
}

function eintrag_erstellen()
{
datenbank.transaction(function (tx)
{
tx.executeSql(‚INSERT INTO bilder (pfad) VALUES („bilder/test1.bmp“)‘);
tx.executeSql(‚INSERT INTO bilder (pfad) VALUES („bilder/test2.bmp“)‘);
tx.executeSql(‚INSERT INTO bilder (pfad) VALUES („bilder/test3.bmp“)‘);
});
}

function eintraege_anzeigen()
{
datenbank.transaction(function (tx)
{
tx.executeSql(‚SELECT * FROM bilder‘, , function (tx, results)
{
for(var i = 0; i < results.rows.length; i++)
{
anzeige = document.getElementById(„anzeige“);
var bild = document.createElement(„img“);
bild.src = results.rows.item(i).pfad;
anzeige.appendChild(bild);
}
}, null);
});
}[/CODE]

Ich danke für alle Antworten!

2 
DELETE FROM bilder WHERE id = ?
3

Ja, aber das soll funktionieren, in dem ich auf ein bild klicke, und das funktioniert bei mir nicht :frowning:

4

Das Thema wird von „HTML“ nach „JavaScript“ verschoben, da 1.) die Auszeichnungssprache für das Anliegen überhaupt nicht „qualifiziert“ ist, und 2.) dafür ein JavaScript mit der Funktion eintrag_loeschen(id) zum Einsatz kommt!

5

„Funktioniert nicht“ ist ja eine dolle Problembeschreibung. Ich sehe auch nicht, wo du überhaupt mit Bildern hantierst.

6

Ich denke da fehlt es einfach an JS Verständnis…

[CODE=JavaScript]function eintrag_loeschen(id)
{
datenbank.transaction(function (tx)
{
tx.executeSql(‚DELETE FROM bilder WHERE id = ?‘, [id]);
});
}

function eintraege_anzeigen()
{
datenbank.transaction(function (tx)
{
tx.executeSql(‚SELECT * FROM bilder‘, , function (tx, results)
{
for(var i = 0; i < results.rows.length; i++)
{
anzeige = document.getElementById(„anzeige“);
var bild = document.createElement(„img“);
bild.src = results.rows.item(i).pfad;
bild.bildId = results.rows[i].id;
bild.onclick = function () {
eintrag_loeschen(this.bildId);
this.parentNode.removeChild(this);
};
anzeige.appendChild(bild);
}
}, null);
});
}
[/CODE]