mirror of
https://github.com/apache/cordova-android.git
synced 2025-04-02 04:42:46 +08:00
133 lines
5.5 KiB
HTML
Executable File
133 lines
5.5 KiB
HTML
Executable File
<!DOCTYPE HTML>
|
|
<html>
|
|
<head>
|
|
<meta name="viewport" content="width=device-width,height=device-height,user-scalable=no,maximum-scale=1.0,initial-scale=1.0" />
|
|
<meta http-equiv="Content-type" content="text/html; charset=utf-8"> <!-- ISO-8859-1 -->
|
|
<title>PhoneGap</title>
|
|
<link rel="stylesheet" href="../master.css" type="text/css" media="screen" title="no title" charset="utf-8">
|
|
<script type="text/javascript" charset="utf-8" src="../phonegap.js"></script>
|
|
|
|
|
|
<script type="text/javascript" charset="utf-8">
|
|
|
|
var deviceReady = false;
|
|
|
|
//-------------------------------------------------------------------------
|
|
// HTML5 Database
|
|
//-------------------------------------------------------------------------
|
|
var db;
|
|
var callDatabase = function() {
|
|
db = openDatabase("mydb", "1.0", "PhoneGap Demo", 20000);
|
|
if (db === null) {
|
|
databaseOutput("Database could not be opened.");
|
|
return;
|
|
}
|
|
databaseOutput("Database opened.");
|
|
db.transaction(function (tx) {
|
|
tx.executeSql('DROP TABLE IF EXISTS DEMO');
|
|
tx.executeSql('CREATE TABLE IF NOT EXISTS DEMO (id unique, data)', [],
|
|
function(tx,results) { console.log("Created table"); },
|
|
function(tx,err) { alert("Error creating table: "+err.message); });
|
|
tx.executeSql('INSERT INTO DEMO (id, data) VALUES (1, "First row")', [],
|
|
function(tx,results) { console.log("Insert row1 success"); },
|
|
function(tx,err) { alert("Error adding 1st row: "+err.message); });
|
|
tx.executeSql('INSERT INTO DEMO (id, data) VALUES (2, "Second row")', [],
|
|
function(tx,results) { console.log("Insert row2 success"); },
|
|
function(tx,err) { alert("Error adding 2nd row: "+err.message); });
|
|
databaseOutput("Data written to DEMO table.");
|
|
console.log("Data written to DEMO table.");
|
|
|
|
tx.executeSql('SELECT * FROM DEMO', [], function (tx, results) {
|
|
var len = results.rows.length;
|
|
var text = "DEMO table: " + len + " rows found.<br>";
|
|
text = text + "<table border='1'><tr><td>Row</td><td>Data</td></tr>";
|
|
for (var i=0; i<len; i++){
|
|
text = text + "<tr><td>" + i + "</td><td>" + results.rows.item(i).id + ", " + results.rows.item(i).data + "</td></tr>";
|
|
}
|
|
text = text + "</table>";
|
|
databaseOutput(text);
|
|
}, function(tx, err) {
|
|
alert("Error processing SELECT * SQL: "+err.message);
|
|
});
|
|
tx.executeSql('SELECT ID FROM DEMO', [], function (tx, results) {
|
|
var len = results.rows.length;
|
|
var text = "DEMO table: " + len + " rows found.<br>";
|
|
text = text + "<table border='1'><tr><td>Row</td><td>Data</td></tr>";
|
|
for (var i=0; i<len; i++){
|
|
text = text + "<tr><td>" + i + "</td><td>" + results.rows.item(i).id + "</td></tr>";
|
|
}
|
|
text = text + "</table>";
|
|
databaseOutput(text);
|
|
}, function(tx, err) {
|
|
alert("Error processing SELECT ID SQL: "+err.message);
|
|
});
|
|
|
|
},
|
|
function(err) {
|
|
console.log("Transaction failed: " + err.message);
|
|
});
|
|
|
|
|
|
};
|
|
|
|
var readDatabase = function() {
|
|
if (!db) {
|
|
db = openDatabase("mydb", "1.0", "PhoneGap Demo", 20000);
|
|
if (db === null) {
|
|
databaseOutput("Database could not be opened.");
|
|
return;
|
|
}
|
|
}
|
|
db.transaction(function (tx) {
|
|
tx.executeSql('SELECT * FROM DEMO WHERE id=2', [], function (tx, results) {
|
|
var len = results.rows.length;
|
|
var text = "DEMO table: " + len + " rows found.<br>";
|
|
text = text + "<table border='1'><tr><td>Row</td><td>Data</td></tr>";
|
|
for (var i=0; i<len; i++){
|
|
text = text + "<tr><td>" + i + "</td><td>" + results.rows.item(i).id + ", " + results.rows.item(i).data + "</td></tr>";
|
|
}
|
|
text = text + "</table>";
|
|
databaseOutput(text);
|
|
}, function(tx, err) {
|
|
alert("Error processing SELECT * WHERE id=2 SQL: "+err.message);
|
|
});
|
|
});
|
|
}
|
|
|
|
var databaseOutput = function(s) {
|
|
var el = document.getElementById("database_results");
|
|
el.innerHTML = el.innerHTML + s + "<br>";
|
|
};
|
|
|
|
/**
|
|
* Function called when page has finished loading.
|
|
*/
|
|
function init() {
|
|
document.addEventListener("deviceready", function() {
|
|
deviceReady = true;
|
|
console.log("Device="+device.platform+" "+device.version);
|
|
}, false);
|
|
window.setTimeout(function() {
|
|
if (!deviceReady) {
|
|
alert("Error: PhoneGap did not initialize. Demo will not run correctly.");
|
|
}
|
|
},1000);
|
|
}
|
|
|
|
</script>
|
|
|
|
</head>
|
|
<body onload="init();" id="stage" class="theme">
|
|
|
|
<h1>HTML5 Database</h1>
|
|
<div id="info">
|
|
<b>Results:</b><br>
|
|
<span id="database_results"></span>
|
|
</div>
|
|
<h2>Action</h2>
|
|
<a href="javascript:" class="btn large" onclick="callDatabase();">Create, Add, Read Database</a>
|
|
<a href="javascript:" class="btn large" onclick="readDatabase();">Read Database</a>
|
|
<h2> </h2><a href="javascript:" class="backBtn" onclick="backHome();">Back</a>
|
|
</body>
|
|
</html>
|