tizen SDK samples/mobile-spec/sql/index.html - cordova-tizen - Git at Google

 <!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>Cordova Mobile Spec</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="../cordova.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>
     <div class="btn large" onclick="callDatabase();">Create, Add, Read Database</div>
     <div class="btn large" onclick="readDatabase();">Read Database</div>
     <h2> </h2><div class="backBtn" onclick="backHome();">Back</div>
   </body>
 </html>
	<!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>Cordova Mobile Spec</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="../cordova.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>
	<div class="btn large" onclick="callDatabase();">Create, Add, Read Database</div>
	<div class="btn large" onclick="readDatabase();">Read Database</div>
	<h2> </h2><div class="backBtn" onclick="backHome();">Back</div>
	</body>
	</html>