Sample PouchDB
HTML
<script src="http://download.pouchdb.com/pouchdb-nightly.min.js"></script>
<div class="appbar">
<button data-bind='click: addCustomer'>Add Customer</button>
</div>
CSS
body {
font-family: Arial;
margin: 60px;
}
table {
border-spacing:0;
border-collapse:collapse;
}
input {
margin:0;
border:0;
font-size: 14px;
padding: 4px;
width: 150px;
}
tr {
border-bottom: 1px solid #000;
}
th.column {
width: 150px;
}
.appbar button {
border: 2px solid;
height: 30px;
cursor: pointer;
}
tbody button {
border: 1px solid #ccc;
font-size: 14px;
cursor: pointer;
}
.appbar {
margin-bottom: 20px;
}
#msg {
background: #c00;
color: #fff;
padding: 5px;
float: right;
display: none;
}
JavaScript
var db = new PouchDB('customers');
db.changes({
continuous: true,
onChange: updateVM
});
var CustomerModel = function () {
var self = this;
self.addCustomer = function () {
alert("here");
var customer = {
_id: new Date().toISOString(),
firstname: "",
lastname: "",
email: "",
telephone: "",
city: ""
};
db.put(customer, function callback(err, result) {
if (!err) {
console.log('Customer added.');
} else {
console.log(err);
}
});
};
self.updateCustomer = function (customer) {
db.put(customer, function callback(err, result) {
if (!err) {
console.log('Customer updated.');
} else {
console.log(err);
}
});
};
self.removeCustomer = function (customer) {
db.remove(customer);
};
self.syncDB = function () {
showMsg('Synchronizing...');
var remoteCouchDB = 'http://idlebit.iriscouch.com/customers';
var options = {
complete: syncDBCompleted
};
db.replicate.to(remoteCouchDB, options);
db.replicate.from(remoteCouchDB, options);
}
};
var viewModel = new CustomerModel();
ko.applyBindings(viewModel);
updateVM();