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
<!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
Device |  |  |
---|
Browser |  |  |  |  |  |  |  |  |  |  |  |  |  |
---|
web sql | Yes | Yes | No | No | No | Yes | Yes | Yes | No | No | Yes | Yes | No |
Delete with Callback
In the following example, the callback function will be called after deleting a data in the table.
Example
<!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