HTML Web SQL Retrieve

Last Updated:

HTML Web SQL Retrieve

In the following example, we will retrieve all the data from the table ('myTeam') under the database ('studentsDB').

Example

HTML Online Editor
<!DOCTYPE html> <html> <body> <button type="button" onclick="retrieveData()">Retrieve Data</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 retrieveData(){ // 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).name )+ "<br>"; }, null); }); } </script> </body> </html>

Browser Support

Devicedesktopmobile
Browsergoogle chromesafarifirefoxinternet Exploreredgeoperagoogle chromesafarifirefoxedgeoperaandroid webviewsamsung internet
web sqlYesYesNoNoNoYesYesYesNoNoYesYesNo

Share this Page

Meet the Author