如何从 pouchdb 数据填充 jquery 移动列表视图

How to populate jquery mobile listview from pouchdb data

本文关键字：jquery 移动 列表 视图 填充 数据 pouchdb      更新时间：2023-09-26

我正在使用jquery mobile和pouchdb开发简单的移动应用程序。我通过此链接 http://pouchdb.com/getting-started.html 遵循了教程。

我正在尝试从pouchdb数据中填充Jquery Mobile列表视图检索。例如，名称（David），每个名称都将链接到一个新页面，该页面提供了完整的信息，例如其电子邮件，年龄等。

我被困在这一行

函数重绘Ui（mydb） {

这是一个源代码。http://jsfiddle.net/Vanilla/p2u8wc5p/

提前谢谢。

var db = new PouchDB('mydb');
var remoteCouch = 'http://localhost:5984/mydb';
db.info(function(err, info) {
  db.changes({
    since: info.update_seq,
    live: true
  }).on('change', showTodos);
});
db.put({
  _id: new Date().toISOString(),
  email: 'dave@gmail.com',
  name: 'David',
});
db.changes().on('change', function() {
  console.log('Ch-Ch-Changes');
});
db.replicate.to('http://127.0.0.1:5984/mydb');
db.replicate.from('http://127.0.0.1:5984/mydb');
function showdetail() {
  db.allDocs({
    include_docs: true,
    descending: true
  }).then(function(doc) {
    redrawUi(doc.rows);
  }).
  catch(function(err) {
    console.log(err);
  });
}
function redrawUi(mydb) {
});
}

假设您返回一个包含 id、名称和电子邮件的对象数组。您只需迭代数组，创建列表项标记并将其附加到现有的列表视图 DOM 元素，例如：

function redrawUi(mydb) {
    var itemsHTML = '';
    for (var i=0; i<mydb.length; i++){
        itemsHTML += '<li>' + mydb[i].name + ' - ' + mydb[i].email + '</li>';
    }
    $("#list").empty().append(itemsHTML).listview("refresh");
}
相关文章：