Monaca Docs
検索…
データベースの利用方法
HTML5 の Web SQL Database を使用して、端末のデータベースに接続します。ここでは、Web SQL Database の使用方法を解説します。
Web SQL Database
接続を行う前に、Database オブジェクトを新規作成します。ここでは、 window.openDatabase を使用して、SQLite データベースを新規作成します。
1
var db = window.openDatabase(database_name, database_version, database_displayname, database_size);
Copied!
データベースの作成 ( SQLite )
1
<!DOCTYPE html>
2
<html>
3
<head>
4
<meta name="viewport" content="width=device-width, user-scalable=no">
5
<script type="text/javascript" charset="utf-8" src="components/loader.js"></script>
6
<script type="text/javascript" charset="utf-8">
7
document.addEventListener("deviceready", onDeviceReady, false);
8
function onDeviceReady() {
9
var db = window.openDatabase("database", "1.0", "testdatabase", 1000000);
10
}
11
</script>
12
</head>
13
<body>
14
<pre>Web SQL Database</pre>
15
</body>
16
</html>
Copied!
openDatabase 関数の引数
指定する引数
説明
設定値
database_nameデータベース名
文字列
database_versionデータベースのバージョン
文字列
database_displaynameデータベースの表示名
文字列
database_sizeデータベースのサイズ ( バイト単位 ）
整数
Database オブジェクトのメソッド
Function
説明
transactionデータベースのトランザクションの処理
changeVersionデータベースのバージョンの確認とスキーマのアップデート ( 必要な場合 )
SQL 文を実行するメソッドは、
SQLTransaction オブジェクトの executesql です。SQLTransaction オブジェクトを取得するには、Database オブジェクトの transaction を実行します。SQLTransaction オブジェクトの executeSql の実行時に、コールバック関数が実行され、 SQLResultSet オブジェクトがコールバック関数に渡されます。SQLResultSet オブジェクトのプロパティ
Function
説明
insertIdINSERT 文の成功時に、行番号を返します。
rowsAffectedSQL の実行により、影響を受けた行を返します。
rowsResultSetRowList オブジェクトを返します。SQL 実行時の処理結果です。SQL 文の実行 ( SQLite )
1
<!DOCTYPE html>
2
<html>
3
<head>
4
<meta charset="utf-8">
5
<meta name="viewport" content="width=device-width, user-scalable=no">
6
<script type="text/javascript" charset="utf-8" src="components/loader.js"></script>
7
<script type="text/javascript" charset="utf-8">
8
9
document.addEventListener("deviceready", onDeviceReady, false);
10
11
function onDeviceReady() {
12
13
window.alert("Create a database and display the content");
14
15
}
16
17
18
function executeQuery(tx) {
19
tx.executeSql('DROP TABLE IF EXISTS TestTable');
20
tx.executeSql('CREATE TABLE IF NOT EXISTS TestTable (id unique, data)');
21
tx.executeSql('INSERT INTO TestTable (id, data) VALUES (1, "あいうえお")');
22
tx.executeSql('INSERT INTO TestTable (id, data) VALUES (2, "かきくけこ")');
23
tx.executeSql('INSERT INTO TestTable (id, data) VALUES (3, "さしすせそ")');
24
tx.executeSql('INSERT INTO TestTable (id, data) VALUES (4, "たちつてと")');
25
tx.executeSql('INSERT INTO TestTable (id, data) VALUES (5, "なにぬねの")');
26
tx.executeSql('INSERT INTO TestTable (id, data) VALUES (6, "はひふへほ")');
27
tx.executeSql('INSERT INTO TestTable (id, data) VALUES (7, "まみむめも")');
28
29
}
30
31
function queryDB(tx) {
32
tx.executeSql('SELECT * FROM TestTable', [], querySuccess, errorCB);
33
}
34
35
function querySuccess(tx, results) {
36
var len = results.rows.length;
37
window.alert("There are " + len + " rows of records in the database.");
38
for (var i=0; i<len; i++){
39
document.writeln("row = " + i + " ID = " + results.rows.item(i).id + " Data = " + results.rows.item(i).data+"<br/>");
40
}
41
}
42
43
//Callback function when the transaction is failed.
44
function errorCB(err) {
45
console.log("Error occured while executing SQL: "+err.code);
46
}
47
48
// Callback function when the transaction is success.
49
function successCB() {
50
var db = window.openDatabase("Database", "1.0", "TestDatabase", 200000);
51
db.transaction(queryDB, errorCB);
52
}
53
54
function createDB(){
55
var db = window.openDatabase("Database", "1.0", "TestDatabase", 200000);
56
db.transaction(executeQuery, errorCB, successCB);
57
58
}
59
60
</script>
61
</head>
62
<body>
63
<h1>Execute the SQL</h1>
64
<input type="button" value="Execute SQL transactions" onclick="createDB()">
65
</body>
66
</html>
Copied!
最終更新 5mo ago