PouchDB上的PhoneGap(Android版) [英] PouchDB on Phonegap (Android)
问题描述
我是新来PouchDB,目前尝试使用Pouchdb我PhoneGap的Android应用程序。我使用托多斯示例应用程序从 http://pouchdb.com/getting-started.html
I'm new to PouchDB, currently try to use Pouchdb on my Phonegap android app. I'm using Todos Sample App from http://pouchdb.com/getting-started.html.
它工作得很好的浏览器,而不是在Android(果冻豆4.2),我使用的HTC One迷你测试应用程序。
It worked fine on browser, but not on Android (Jelly Bean 4.2), I'm using HTC One Mini to test the app.
下面是我的code:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>VanillaJS TodoMVC</title>
<link rel="stylesheet" href="style/base.css">
<!--[if IE]>
<script src="style/ie.js"></script>
<![endif]-->
<script src="js/jquery-1.10.2.min.js" type="text/javascript"></script>
</head>
<body>
<section id="todoapp">
<header id="header">
<h1>todos</h1>
<input id="new-todo" placeholder="What needs to be done?" autofocus value="">
</header>
<section id="main">
<ul id="todo-list"></ul>
</section>
<footer id="footer">
<span id="todo-count"></span>
<div id="sync-wrapper">
<div id="sync-success">Currently syncing</div>
<div id="sync-error">There was a problem syncing</div>
</div>
</footer>
</section>
<script src="js/pouchdb-nightly.min.js"></script>
<script src="js/app.js"></script>
<script src="js/base.js"></script>
</body>
</html>
下面是app.js code:
Here is app.js code :
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady(){}
(function() {
'use strict';
var ENTER_KEY = 13;
var newTodoDom = document.getElementById('new-todo');
var syncDom = document.getElementById('sync-wrapper');
// EDITING STARTS HERE (you dont need to edit anything above this line)
var db = new PouchDB('todos');
var remoteCouch = false;
db.info(function(err, info) {
db.changes({
since: info.update_seq,
continuous: true,
onChange: showTodos
});
});
// We have to create a new todo document and enter it in the database
function addTodo(text) {
var todo = {
_id: new Date().toISOString(),
title: text,
completed: false
};
db.put(todo, function callback(err, result) {
if(!err) {
console.log('Successfully posted a todo!');
}
});
}
// Show the current list of todos by reading them from the database
function showTodos() {
db.allDocs({include_docs: true, descending:true}, function(err,doc) {
redrawTodosUI(doc.rows);
});
}
function checkboxChanged(todo, event) {
todo.completed = event.target.checked;
db.put(todo);
}
// User pressed the delete button for a todo, delete it
function deleteButtonPressed(todo) {
db.remove(todo);
}
// The input box when editing a todo has blurred, we should save
// the new title or delete the todo if the title is empty
function todoBlurred(todo, event) {
var trimmedText = event.target.value.trim();
if(!trimmedText) {
db.remove(todo);
} else {
todo.title = trimmedText;
db.put(todo);
}
}
// Initialise a sync with the remote server
function sync() {
}
// EDITING STARTS HERE (you dont need to edit anything below this line)
// There was some form or error syncing
function syncError() {
syncDom.setAttribute('data-sync-state', 'error');
}
// User has double clicked a todo, display an input so they can edit the title
function todoDblClicked(todo) {
var div = document.getElementById('li_' + todo._id);
var inputEditTodo = document.getElementById('input_' + todo._id);
div.className = 'editing';
inputEditTodo.focus();
}
// If they press enter while editing an entry, blur it to trigger save
// (or delete)
function todoKeyPressed(todo, event) {
if (event.keyCode === ENTER_KEY) {
var inputEditTodo = document.getElementById('input_' + todo._id);
inputEditTodo.blur();
}
}
// Given an object representing a todo, this will create a list item
// to display it.
function createTodoListItem(todo) {
var checkbox = document.createElement('input');
checkbox.className = 'toggle';
checkbox.type = 'checkbox';
checkbox.addEventListener('change', checkboxChanged.bind(this, todo));
var label = document.createElement('label');
label.appendChild( document.createTextNode(todo.title));
label.addEventListener('dblclick', todoDblClicked.bind(this, todo));
var deleteLink = document.createElement('button');
deleteLink.className = 'destroy';
deleteLink.addEventListener( 'click', deleteButtonPressed.bind(this, todo));
var divDisplay = document.createElement('div');
divDisplay.className = 'view';
divDisplay.appendChild(checkbox);
divDisplay.appendChild(label);
divDisplay.appendChild(deleteLink);
var inputEditTodo = document.createElement('input');
inputEditTodo.id = 'input_' + todo._id;
inputEditTodo.className = 'edit';
inputEditTodo.value = todo.title;
inputEditTodo.addEventListener('keypress', todoKeyPressed.bind(this, todo));
inputEditTodo.addEventListener('blur', todoBlurred.bind(this, todo));
var li = document.createElement('li');
li.id = 'li_' + todo._id;
li.appendChild(divDisplay);
li.appendChild(inputEditTodo);
if (todo.completed) {
li.className += 'complete';
checkbox.checked = true;
}
return li;
}
function redrawTodosUI(todos) {
var ul = document.getElementById('todo-list');
ul.innerHTML = '';
todos.forEach(function(todo) {
ul.appendChild(createTodoListItem(todo.doc));
});
}
function newTodoKeyPressHandler( event ) {
if (event.keyCode === ENTER_KEY) {
addTodo(newTodoDom.value);
newTodoDom.value = '';
}
}
function addEventListeners() {
newTodoDom.addEventListener('keypress', newTodoKeyPressHandler, false);
}
addEventListeners();
showTodos();
if (remoteCouch) {
sync();
}
})();
问题:
当我加入待办事项,preSS enter..it后不会出现什么..
我不知道在我的Android手机本地数据库中尚未创建的。
Problem : When i add a todos, after press enter..it doesn't appear anything.. I wonder the local database in my android phone not created yet.
希望有人能帮助我out..any答案将AP preciate!
Hope somebody could help me out..any answer would appreciate!
感谢
推荐答案
我有两个问题PouchDB与Android版本的工作早于4.2。
I had two problems with PouchDB working with Android versions earlier than 4.2.
-
功能ATOB和BTOA。我结束了不使用它们,但是,原谅我,我不记得我究竟是如何评论/砍死他们。我当然没有用垫片更换它们。
不支持
The functions atob and btoa were not supported. I ended up not using them, though, forgive me, I don't recall exactly how I commented/hacked them out. I certainly didn't replace them with a shim.
由于某些原因,INDEXDB,性LevelDB,的WebSQL preference订单不是为我工作。我不得不说具体使用的WebSQL。我看到一些code,它检测到您是否正在运行的PhoneGap /科尔多瓦,然后使用的WebSQL(这相当于sqllite在Android),但由于某种原因,这不是任何工作。
For some reason the indexdb, leveldb, websql preference order wasn't working for me. I had to specifically say use websql. I saw some code that detected whether you were running phonegap/cordova, and then uses websql (which translates to sqllite on Android), but for some reason that wasn't working either.
希望帮助!
这篇关于PouchDB上的PhoneGap(Android版)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!