`
fanfq
  • 浏览: 264145 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

phonegap-storage

阅读更多
phonegap 就不多做介绍了,在此你看到的文章的分类就略知其作用了。
本节介绍的phonegap的存贮的实现,比较奇怪的是我始终都没有找到其存储文件存放的目录在哪里,原本以为会在/data/data/app package/databases/ 其实不然,在stackoverflow,gmailgroup里面都提问了,尚未得到有效的答复。希望有经验的朋友能够在此留言告知于我,表示感谢!
其实就两个页面,实现CRUD的操作,so easy!
index.html
<!DOCTYPE html>
<html>
<head>
<title>Storage Example</title>

<script type="text/javascript" charset="utf-8" src="cordova-2.0.0.js"></script>
<script type="text/javascript" charset="utf-8">
	// Wait for Cordova 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 integer PRIMARY KEY autoincrement, title text,content text)');
			//tx.executeSql('INSERT INTO DEMO (title,content) VALUES ("First row","first content")');
			//tx.executeSql('INSERT INTO DEMO (title,content) VALUES ("Second row","second content")');
	}

	// 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;
		var div = "<table>";
		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).title);
			div += "<tr><td>" + i + "</td>" + "<td>" + results.rows.item(i).id
					+ "</td>" + "<td>" + results.rows.item(i).title + "</td>"
					+ "<td>" + results.rows.item(i).content + "</td>"
					+ "<td><a href='#' onclick='deletes("
					+ results.rows.item(i).id + ");'>delete</a></td></tr>";
		}
		div += "</table>";
		document.getElementById("div").innerHTML = div;
	}

	var index;

	function deletes(index_) {
		index = index_;
		var db = window.openDatabase("Database", "1.0", "Cordova Demo", 200000);
		db.transaction(deletes_, errorCB, successCB);
	}
	function deletes_(tx) {
		tx.executeSql('delete FROM DEMO where id = ' + index, [], querySuccess,
				errorCB);
	}

	// 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", "Cordova Demo", 200000);
		db.transaction(queryDB, errorCB);

		console.log("Success processing SQL: ");
	}

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

	function display() {
		var db = window.openDatabase("Database", "1.0", "Cordova Demo", 200000);
		db.transaction(queryDB, errorCB);
	}

	function search() {
		var db = window.openDatabase("Database", "1.0", "Cordova Demo", 200000);
		db.transaction(search_, errorCB, querySuccess);
	}

	function search_(tx) {
		var key = document.getElementById("keywords").value;
		console.log("key: " + key);
		tx.executeSql("SELECT * FROM DEMO where title like '%" + key + "%'",
				[], querySuccess, errorCB);
	}
</script>
</head>
<body>
	<h1>Example</h1>
	Database


	[url=add.html]Add[/url]

	<input name="keywords" id="keywords" placeholder="search something">
	<input type="submit" onclick="search();" />

	<div id="div"></div>

</body>
</html>


add.html
<!DOCTYPE html>
<html>
  <head>
    <title>Storage Example</title>

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

    // Wait for Cordova to load
    //

    function inster(){
    	
    	var db = window.openDatabase("Database", "1.0", "Cordova Demo", 200000);
        db.transaction(inster_, errorCB, successCB);
    }
    
    function inster_(tx){
    	var t = document.getElementById("title").value;
    	var c =  document.getElementById("content").value;
    	tx.executeSql("INSERT INTO DEMO (title,content) VALUES ('"+t+"','"+c+"')");
    }
    
    // Transaction error callback
    //
    function errorCB(err) {
        console.log("Error processing SQL: "+err.code);
    }

    // Transaction success callback
    //
    function successCB() {
        console.log("Success processing SQL: ");
    }

    </script>
  </head>
  <body>
    <h1>Example</h1>
    Database - Add

    
    Title:
    <input type="text" id="title"/>
    Content:
    <input type="text" id="content"/>
    <input type="submit" id="submit" value="submit" onclick="inster();"/>
    
    
  </body>
</html>



代码较为简单就不多做介绍了,附件中含工程源码。遇到问题敬请留言。
0
2
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics