Storage — PhoneGap 1.2.0

About this version

This page preserves the official documentation for Version 1.2.0. Commands, supported platforms and API behavior below belong to that historical version. For active projects, consult the current Apache Cordova documentation.

Reference sections

• Storage
• Database
• localStorage
• display_name
• name
• size
• version
• SQLError
• SQLResultSet
• SQLResultSetList
• SQLTransaction
• openDatabase

Storage

Provides access to the devices storage options.

This API is based on the W3C Web SQL Database Specification and W3C Web Storage API Specification. Some devices already provide an implementation of this spec. For those devices, the built-in support is used instead of replacing it with PhoneGap's implementation. For devices that don't have storage support, PhoneGap's implementation should be compatible with the W3C specification.

Methods

• openDatabase

Arguments

• name
• version
• display_name
• size

Objects

• Database
• SQLTransaction
• SQLResultSet
• SQLResultSetList
• SQLError
• localStorage

Database

Contains methods that allow the user to manipulate the Database

Methods

• transaction: Runs a database transaction.
• changeVersion: method allows scripts to atomically verify the version number and change it at the same time as doing a schema update.

Details

A Database object is returned from a call to window.openDatabase().

Supported Platforms

• Android
• BlackBerry WebWorks (OS 6.0 and higher)
• iPhone

Transaction Quick Example

function populateDB(tx) {
	 tx.executeSql('DROP TABLE IF EXISTS DEMO');
	 tx.executeSql('CREATE TABLE IF NOT EXISTS DEMO (id unique, data)');
	 tx.executeSql('INSERT INTO DEMO (id, data) VALUES (1, "First row")');
	 tx.executeSql('INSERT INTO DEMO (id, data) VALUES (2, "Second row")');
}

function errorCB(err) {
	alert("Error processing SQL: "+err.code);
}

function successCB() {
	alert("success!");
}

var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000);
db.transaction(populateDB, errorCB, successCB);

Change Version Quick Example

var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000);
db.changeVersion("1.0", "1.1");

Full Example

<!DOCTYPE html>
<html>
  <head>
    <title>Contact Example</title>

    <script type="text/javascript" charset="utf-8" src="phonegap-1.2.0.js"></script>
    <script type="text/javascript" charset="utf-8">

    // Wait for PhoneGap to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);

    // PhoneGap is ready
    //
    function onDeviceReady() {
		var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000);
		db.transaction(populateDB, errorCB, successCB);
    }
	
	// Populate the database 
	//
	function populateDB(tx) {
		 tx.executeSql('DROP TABLE IF EXISTS DEMO');
		 tx.executeSql('CREATE TABLE IF NOT EXISTS DEMO (id unique, data)');
		 tx.executeSql('INSERT INTO DEMO (id, data) VALUES (1, "First row")');
		 tx.executeSql('INSERT INTO DEMO (id, data) VALUES (2, "Second row")');
	}
	
	// Transaction error callback
	//
	function errorCB(tx, err) {
		alert("Error processing SQL: "+err);
	}
	
	// Transaction success callback
	//
	function successCB() {
		alert("success!");
	}

    </script>
  </head>
  <body>
    <h1>Example</h1>
    <p>Database</p>
  </body>
</html>

Android 1.X Quirks

• changeVersion: This method is not support by Android 1.X devices.

localStorage

Provides access to a W3C Storage interface (http://dev.w3.org/html5/webstorage/#the-localstorage-attribute)

var storage = window.localStorage;

Methods

• key: Returns the name of the key at the position specified.
• getItem: Returns the item identified by it's key.
• setItem: Saves and item at the key provided.
• removeItem: Removes the item identified by it's key.
• clear: Removes all of the key value pairs.

Details

localStorage provides an interface to a W3C Storage interface. It allows one to save data as key-value pairs.

Supported Platforms

• Android
• BlackBerry WebWorks (OS 6.0 and higher)
• iPhone

Key Quick Example

var keyName = window.localStorage.key(0);

Set Item Quick Example

window.localStorage.setItem("key", "value");

Get Item Quick Example

var value = window.localStorage.getItem("key");
// value is now equal to "value"

Remove Item Quick Example

window.localStorage.removeItem("key");

Clear Quick Example

window.localStorage.clear();

Full Example

<!DOCTYPE html>
<html>
  <head>
    <title>Contact Example</title>

    <script type="text/javascript" charset="utf-8" src="phonegap-1.2.0.js"></script>
    <script type="text/javascript" charset="utf-8">

    // Wait for PhoneGap to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);

    // PhoneGap is ready
    //
    function onDeviceReady() {
		window.localStorage.setItem("key", "value");
		var keyname = window.localStorage.key(i);
		// keyname is now equal to "key"
		var value = window.localStorage.getItem("key");
		// value is now equal to "value"
		window.localStorage.removeItem("key");
		window.localStorage.setItem("key2", "value2");
		window.localStorage.clear();
		// localStorage is now empty
    }


    </script>
  </head>
  <body>
    <h1>Example</h1>
    <p>localStorage</p>
  </body>
</html>

display_name

The display name of the database.

name

The name of the database.

size

The size of the database in bytes.

version

The version of the database.

SQLError

A SQLError object is thrown when an error occurs.

Properties

• code: One of the predefined error codes listed below.
• message: A description of the error.

Constants

• SQLError.UNKNOWN_ERR
• SQLError.DATABASE_ERR
• SQLError.VERSION_ERR
• SQLError.TOO_LARGE_ERR
• SQLError.QUOTA_ERR
• SQLError.SYNTAX_ERR
• SQLError.CONSTRAINT_ERR
• SQLError.TIMEOUT_ERR

Description

The SQLError object is thrown when an error occurs when manipulating a database.

SQLResultSet

When the executeSql method of a SQLTransaction is called it will invoke it's callback with a SQLResultSet.

Properties

• insertId: the row ID of the row that the SQLResultSet object's SQL statement inserted into the database
• rowAffected: the number of rows that were changed by the SQL statement. If the statement did not affect any rows then it is set to 0.
• rows: a SQLResultSetRowList representing the rows returned. If no rows are returned the object will be empty.

Details

When you call the SQLTransaction executeSql method it's callback methods will be called with a SQLResultSet object. The result object has three properties. The first is the insertId which will return the row number of a success SQL insert statement. If the SQL statement is not an insert then the insertId is not set. The rowAffected is always 0 for a SQL select statement. For insert or update statements it returns the number of rows that have been modified. The final property is of type SQLResultSetList and it contains the data returned from a SQL select statement.

Supported Platforms

• Android
• BlackBerry WebWorks (OS 6.0 and higher)
• iPhone

Execute SQL Quick Example

function queryDB(tx) {
	tx.executeSql('SELECT * FROM DEMO', [], querySuccess, errorCB);
}

function querySuccess(tx, results) {
	// this will be empty since no rows were inserted.
	console.log("Insert ID = " + results.insertId);
	// this will be 0 since it is a select statement
	console.log("Rows Affected = " + results.rowAffected);
	// the number of rows returned by the select statement
	console.log("Insert ID = " + results.rows.length);
}

function errorCB(err) {
	alert("Error processing SQL: "+err.code);
}

var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000);
db.transaction(queryDB, errorCB);

Full Example

<!DOCTYPE html>
<html>
  <head>
    <title>Contact Example</title>

    <script type="text/javascript" charset="utf-8" src="phonegap-1.2.0.js"></script>
    <script type="text/javascript" charset="utf-8">

    // Wait for PhoneGap to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);

	// Populate the database 
	//
	function populateDB(tx) {
		tx.executeSql('DROP TABLE IF EXISTS DEMO');
		tx.executeSql('CREATE TABLE IF NOT EXISTS DEMO (id unique, data)');
		tx.executeSql('INSERT INTO DEMO (id, data) VALUES (1, "First row")');
		tx.executeSql('INSERT INTO DEMO (id, data) VALUES (2, "Second row")');
	}

	// Query the database
	//
	function queryDB(tx) {
		tx.executeSql('SELECT * FROM DEMO', [], querySuccess, errorCB);
	}

	// Query the success callback
	//
	function querySuccess(tx, results) {
		// this will be empty since no rows were inserted.
		console.log("Insert ID = " + results.insertId);
		// this will be 0 since it is a select statement
		console.log("Rows Affected = " + results.rowAffected);
		// the number of rows returned by the select statement
		console.log("Insert ID = " + results.rows.length);
	}

	// Transaction error callback
	//
	function errorCB(err) {
		console.log("Error processing SQL: "+err.code);
	}

	// Transaction success callback
	//
	function successCB() {
		var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000);
		db.transaction(queryDB, errorCB);
	}

	// PhoneGap is ready
	//
	function onDeviceReady() {
		var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000);
		db.transaction(populateDB, errorCB, successCB);
	}

    </script>
  </head>
  <body>
    <h1>Example</h1>
    <p>Database</p>
  </body>
</html>

SQLResultSetList

One of the properties of the SQLResultSet containing the rows returned from a SQL query.

Properties

• length: the number of rows returned by the SQL query

Methods

• item: returns the row at the specified index represented by a JavaScript object.

Details

The SQLResultSetList contains the data returned from a SQL select statement. The object contains a length property letting you know how many rows the select statement has been returned. To get a row of data you would call the item method specifing an index. The item method returns a JavaScript Object who's properties are the columns of the database the select statement was executed against.

Supported Platforms

• Android
• BlackBerry WebWorks (OS 6.0 and higher)
• iPhone

Execute SQL Quick Example

function queryDB(tx) {
	tx.executeSql('SELECT * FROM DEMO', [], querySuccess, errorCB);
}

function querySuccess(tx, results) {
	var len = results.rows.length;
   	console.log("DEMO table: " + len + " rows found.");
   	for (var i=0; i<len; i++){
    	console.log("Row = " + i + " ID = " + results.rows.item(i).id + " Data =  " + results.rows.item(i).data);
	}
}

function errorCB(err) {
	alert("Error processing SQL: "+err.code);
}

var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000);
db.transaction(queryDB, errorCB);

Full Example

<!DOCTYPE html>
<html>
  <head>
    <title>Contact Example</title>

    <script type="text/javascript" charset="utf-8" src="phonegap-1.2.0.js"></script>
    <script type="text/javascript" charset="utf-8">

    // Wait for PhoneGap to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);

	// Populate the database 
	//
	function populateDB(tx) {
		tx.executeSql('DROP TABLE IF EXISTS DEMO');
		tx.executeSql('CREATE TABLE IF NOT EXISTS DEMO (id unique, data)');
		tx.executeSql('INSERT INTO DEMO (id, data) VALUES (1, "First row")');
		tx.executeSql('INSERT INTO DEMO (id, data) VALUES (2, "Second row")');
	}

	// Query the database
	//
	function queryDB(tx) {
		tx.executeSql('SELECT * FROM DEMO', [], querySuccess, errorCB);
	}

	// Query the success callback
	//
	function querySuccess(tx, results) {
		var len = results.rows.length;
		console.log("DEMO table: " + len + " rows found.");
		for (var i=0; i<len; i++){
			console.log("Row = " + i + " ID = " + results.rows.item(i).id + " Data =  " + results.rows.item(i).data);
		}
	}

	// Transaction error callback
	//
	function errorCB(err) {
		console.log("Error processing SQL: "+err.code);
	}

	// Transaction success callback
	//
	function successCB() {
		var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000);
		db.transaction(queryDB, errorCB);
	}

	// PhoneGap is ready
	//
	function onDeviceReady() {
		var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000);
		db.transaction(populateDB, errorCB, successCB);
	}

    </script>
  </head>
  <body>
    <h1>Example</h1>
    <p>Database</p>
  </body>
</html>

SQLTransaction

Contains methods that allow the user to execute SQL statements against the Database.

Methods

• executeSql: executes a SQL statement

Details

When you call a Database objects transaction method it's callback methods will be called with a SQLTransaction object. The user can build up a database transaction by calling the executeSql method multiple times.

Supported Platforms

• Android
• BlackBerry WebWorks (OS 6.0 and higher)
• iPhone

Execute SQL Quick Example

function populateDB(tx) {
	 tx.executeSql('DROP TABLE IF EXISTS DEMO');
	 tx.executeSql('CREATE TABLE IF NOT EXISTS DEMO (id unique, data)');
	 tx.executeSql('INSERT INTO DEMO (id, data) VALUES (1, "First row")');
	 tx.executeSql('INSERT INTO DEMO (id, data) VALUES (2, "Second row")');
}

function errorCB(err) {
	alert("Error processing SQL: "+err);
}

function successCB() {
	alert("success!");
}

var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000);
db.transaction(populateDB, errorCB, successCB);

Full Example

<!DOCTYPE html>
<html>
  <head>
    <title>Contact Example</title>

    <script type="text/javascript" charset="utf-8" src="phonegap-1.2.0.js"></script>
    <script type="text/javascript" charset="utf-8">

    // Wait for PhoneGap to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);

    // PhoneGap is ready
    //
    function onDeviceReady() {
		var db = window.openDatabase("Database", "1.0", "PhoneGap Demo", 200000);
		db.transaction(populateDB, errorCB, successCB);
    }
	
	// Populate the database 
	//
	function populateDB(tx) {
		 tx.executeSql('DROP TABLE IF EXISTS DEMO');
		 tx.executeSql('CREATE TABLE IF NOT EXISTS DEMO (id unique, data)');
		 tx.executeSql('INSERT INTO DEMO (id, data) VALUES (1, "First row")');
		 tx.executeSql('INSERT INTO DEMO (id, data) VALUES (2, "Second row")');
	}
	
	// Transaction error callback
	//
	function errorCB(err) {
		alert("Error processing SQL: "+err);
	}
	
	// Transaction success callback
	//
	function successCB() {
		alert("success!");
	}

    </script>
  </head>
  <body>
    <h1>Example</h1>
    <p>SQLTransaction</p>
  </body>
</html>

openDatabase

Returns a new Database object.

var dbShell = window.openDatabase(name, version, display_name, size);

Description

window.openDatabase returns a new Database object.

This method will create a new SQL Lite Database and return a Database object. Use the Database Object to manipulate the data.

Supported Platforms

• Android
• BlackBerry WebWorks (OS 6.0 and higher)
• iPhone

Quick Example

var db = window.openDatabase("test", "1.0", "Test DB", 1000000);

Full Example

<!DOCTYPE html>
<html>
  <head>
    <title>Contact Example</title>

    <script type="text/javascript" charset="utf-8" src="phonegap-1.2.0.js"></script>
    <script type="text/javascript" charset="utf-8">

    // Wait for PhoneGap to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);

    // PhoneGap is ready
    //
    function onDeviceReady() {
		var db = window.openDatabase("test", "1.0", "Test DB", 1000000);
    }
	
    </script>
  </head>
  <body>
    <h1>Example</h1>
    <p>Open Database</p>
  </body>
</html>