Time for action – populating a local database

In order to reinforce what you just learned, you will create a new local database, add a table to it, and write and read some data.

1. Return to the project you created for the previous example or create a new project. Clean out the content of the index.html file, and add the following button markup to it. This button will be used to query the data back from the database:

   <button type="button" onclick="queryEmployees()">Fetch All Rows</button>

2. Create a JavaScript tag and the deviceready event listener:

   document.addEventListener("deviceready", onDeviceReady, false);

3. In the body of the onDeviceReady function, we will create a new database called EMP with version number of 1.0, named Employee Details, with an estimated size of 2 MB:

   var size = (1024 * 1024 * 2);
   
   function onDeviceReady() {
      var database = window.openDatabase('employee', '1.0', 'Employee Details', size);
      database.transaction(populateDB, onError, onSuccess);
   }

   Once the database...