Peter Lubbers - Pro HTML 5 Programming

Figure 9-11. sql.html displaying the results of SELECT * FROM racers
CHAPTER 9 ■ USING THE HTML5 WEB STORAGE API
Database operations can take some time to complete. Instead of blocking script execution until a
result set is available, queries run in the background. When the results are available, a function given as
the third argument to executeSQL() is called back with the transaction and the result set as arguments.
Listing 9-13 shows the complete code for the file sql.html; the sample code shown is also located in
the code/storage folder.
Listing 9-13. Using the Web SQL Database API
Web SQL Database
// open a database by name
var db = openDatabase('db', '1.0', 'my first database', 2 * 1024 * 1024);
function log(id, name) {
var row = document.createElement("tr");
var idCell = document.createElement("td");
var nameCell = document.createElement("td");
idCell.textContent = id;
nameCell.textContent = name;
row.appendChild(idCell);
row.appendChild(nameCell);
}
document.getElementById("racers").appendChild(row);
function doQuery() {
db.transaction(function (tx) {
tx.executeSql('SELECT * from racers', [], function(tx, result) {
// log SQL result set
for (var i=0; i