01.var results = document.getElementById('results');
02. var id = document.getElementById('id');
03. var firstName = document.getElementById('firstName');
04. var lastName = document.getElementById('lastName');
05. var phone = document.getElementById('phone');
06.
07. var createStatement = "CREATE TABLE IF NOT EXISTS Contacts (id INTEGER PRIMARY KEY AUTOINCREMENT, firstName TEXT, lastName TEXT, phone TEXT)";
08. var selectAllStatement = "SELECT * FROM Contacts";
09. var insertStatement = "INSERT INTO Contacts (firstName, lastName, phone) VALUES (?, ?, ?)";
10. var updateStatement = "UPDATE Contacts SET firstName = ?, lastName = ?, phone = ? WHERE id = ?";
11. var deleteStatement = "DELETE FROM Contacts WHERE id=?";
12. var dropStatement = "DROP TABLE Contacts";
13.
14. var db = openDatabase("AddressBook", "1.0", "Address Book", 200000);
15. var dataset;
16. createTable();
17.
18. function onError(tx, error) {
19. alert(error.message);
20. }
21.
22. function showRecords() {
23. results.innerHTML = '';
24. db.transaction(function(tx) {
25. tx.executeSql(selectAllStatement, [], function(tx, result) {
26.dataset = result.rows;
27. for (var i = 0, item = null; i < dataset.length; i++) {
28. item = dataset.item(i);
29. results.innerHTML +=
30. '<li>' + item['lastName'] + ' , ' + item['firstName'] + ' <a href="#" onclick="loadRecord('+i+')">edit</a> ' +
31. '<a href="#" onclick="deleteRecord('+item['id']+')">delete</a></li>';
32.}
33. });
34. });
35. }
36.
37. function createTable() {
38. db.transaction(function(tx) {
39. tx.executeSql(createStatement, [], showRecords, onError);
40. });
41. }
42.
43. function insertRecord() {
44. db.transaction(function(tx) {
45. tx.executeSql(insertStatement, [firstName.value, lastName.value, phone.value], loadAndReset, onError);
46. });
47. }
48.
49. function loadRecord(i) {
50.var item = dataset.item(i);
51. firstName.value = item['firstName'];
52.lastName.value = item['lastName'];
53.phone.value = item['phone'];
54.id.value = item['id'];
55. }
56.
57. function updateRecord() {
58. db.transaction(function(tx) {
59. tx.executeSql(updateStatement, [firstName.value, lastName.value, phone.value, id.value], loadAndReset, onError);
60. });
61. }
62.
63. function deleteRecord(id) {
64. db.transaction(function(tx) {
65. tx.executeSql(deleteStatement, [id], showRecords, onError);
66. });
67.resetForm();
68. }
69.
70. function dropTable() {
71. db.transaction(function(tx) {
72. tx.executeSql(dropStatement, [], showRecords, onError);
73. });
74.resetForm();
75. }
76.
77. function loadAndReset(){
78. resetForm();
79. showRecords();
80. }
81.
82. function resetForm(){
83.firstName.value = '';
84.lastName.value = '';
85.phone.value = '';
86.id.value = '';
87. }
