AJAX - The Complete Reference

(avery) #1

542 Part III: Advanced Topics


</script>
<body>
<h2>Offline Browsing with Google Gears </h2>
<a href="offlinepage.html">Visit Next Page</a><br /><br />
<form action="#">
<input type="button" id="captureBtn" value="Capture Files" />
<input type="button" id="eraseBtn" value="Erase Stored Files" />
</form>
<br />
<div id="responseOutput"></div>
</body>
</html>

Gears also provides an offline database that we can write to. After we initialize Gears,
we can create a database with a call like so:

db = google.gears.factory.create('beta.database', '1.0');

Once we have a handle on our database, we can perform familiar commands upon it.
First, we open the database.

db.open('database-demo');

Next, we execute a SQL statement to create a table to be used offline if it is not there:

db.execute('create table if not exists todolist
(todonum int, todo varchar(255))');

Later, we can perform normal SQL statements upon the database. For example, here we
issue a standard select statement and print out either a message that no data is available in
the case no rows are returned, or each row line by line until finished.

var todolist = document.getElementById('todolist');
todolist.innerHTML = '';

var rs = db.execute('select * from todolist order by todonum asc');
if (!rs.isValidRow())
{
todolist.innerHTML = "<em>No items</em>";
rs.close();
return;
}
while (rs.isValidRow())
{
todolist.innerHTML += rs.field(0) + ") "+ rs.field(1) +"<br />";
rs.next();
}
rs.close();

It is pretty clear that we could build a simple to-do list maker since we have a local
database. We see this in Figure 10-13, and you can run the example at http://ajaxref.com/
ch10/gearsdb.html.
Free download pdf