HTML Web SQL Delete

Last Updated:

HTML Web SQL Delete

In the following example, we will delete a data (where id=1) in the table ('myTeam') under the database ('studentsDB').

Example

HTML Online Editor
<!DOCTYPE html> <html> <body> <button type="button" onclick="Delete()">Delete a Record</button> <div id="point"></div> <script> var x = document.getElementById("point"); var db = openDatabase('studentsDB', '1.0', 'Test DB', 2 * 1024 * 1024); // Insert db.transaction(function (tx){ tx.executeSql('CREATE TABLE IF NOT EXISTS myTeam (id unique, name)'); tx.executeSql('INSERT INTO myTeam (id, name) VALUES (1, "Brendan")'); tx.executeSql('INSERT INTO myTeam (id, name) VALUES (2, "Harley")'); }); function Delete(){ // Delete db.transaction(function (tx) { tx.executeSql('delete from myTeam where id=1'); }); // Retrieve db.transaction(function (tx) { tx.executeSql('SELECT * FROM myTeam', [], function (tx, data){ var len = data.rows.length, i; msg = "<p>You have: " + len + " members in your team</p>"; x.innerHTML += msg; for(i = 0; i < len; i++) x.innerHTML += (data.rows.item(i).id+ ". "+ data.rows.item(i).name )+ "<br>"; x.innerHTML += "Change id in delete section to see changes again."; }, null); }); } </script> </body> </html>

Browser Support

Devicedesktopmobile
Browsergoogle chromesafarifirefoxinternet Exploreredgeoperagoogle chromesafarifirefoxedgeoperaandroid webviewsamsung internet
web sqlYesYesNoNoNoYesYesYesNoNoYesYesNo

Delete with Callback

In the following example, the callback function will be called after deleting a data in the table.

Example

HTML Online Editor
<!DOCTYPE html> <html> <body> <button type="button" onclick="Delete()">Delete a Record</button> <div id="point"></div> <script> var x = document.getElementById("point"); var db = openDatabase('studentsDB', '1.0', 'Test DB', 2 * 1024 * 1024); //Insert db.transaction(function (tx) { tx.executeSql('CREATE TABLE IF NOT EXISTS myTeam (id unique, name)'); tx.executeSql('INSERT INTO myTeam (id, name) VALUES (1, "Brendan")'); tx.executeSql('INSERT INTO myTeam (id, name) VALUES (2, "Harley")'); }); function Delete(){ // Delete db.transaction(function (tx) { tx.executeSql('delete from myTeam where id=?', [1], function(transaction, result) { alert("Row index " + result.rowsAffected +" is deleted"); }); }); // Retrieve db.transaction(function (tx) { tx.executeSql('SELECT * FROM myTeam', [], function (tx, data){ var len = data.rows.length, i; msg = "<p>You have: " + len + " members in your team</p>"; x.innerHTML += msg; for(i = 0; i < len; i++) x.innerHTML += (data.rows.item(i).id+ ". "+ data.rows.item(i).name )+ "<br>"; x.innerHTML += "Change id in delete section to see changes again."; }, null); }); } </script> </body> </html>

Share this Page

Meet the Author