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

时间:2014-11-23 17:59:47

标签: javascript listview jquery-mobile cordova pouchdb

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

我正在尝试从pouchdb数据填充Jquery Mobile listview检索。例如,名称(大卫),每个名称将链接到一个新页面,提供完整的信息,如电子邮件,年龄等。

我被困在这条线上

function redrawUi(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) {



});
}

1 个答案:

答案 0 :(得分:0)

假设您返回了一个包含id,name和email的对象数组。您只需迭代数组,创建listitem标记并将其附加到现有的listview 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");
}