Jquery 如何使用（jqtouch+；phonegap）从数据库中检索值并在html5中显示

我正在尝试使用html5、javascript、jqtouch和phonegap制作一个针对移动健康的Iphone应用程序。我正在做一个学校项目，学习使用html5 jqtouch和phonegap构建Iphone应用程序

我可以在数据库表中创建一个以pName作为列的数据库。但我无法在index.html中的空div（第一个名为patientList的窗格）中填充整个患者姓名列表

我制作了一个名为index.html的文件。此文件具有不同的窗格。 第一个窗格是耐心列表窗格。第二个窗格是在数据库中创建一个新条目。 在数据库中创建新条目后，第一个名为“患者列表”的窗格应填充患者的所有姓名。我的代码成功创建了一个数据库，但在PatientList窗格中没有显示任何患者的姓名（pName）

我第一次使用HTML5、CSS、JAVASCRIPT、JQTOUCH和PHONEGAP制作iphone应用程序。我需要你的帮助

我的index.html如下所示

<div id="patientList">
      <div class="toolbar">
          <h1>patientList</h1>
          <a class="button slideup" href="#newEntry">+</a>
      </div>
      <ul class="edgetoedge">

          <li id="entryTemplate" class="entry" style="display:none">
              <span class="label">Label</span>

          </li>

      </ul>
  </div>

病人


标签

新病人





+ 

我的iphone.js看起来像这样

     var jQT = new $.jQTouch({
           });

  var db;

    $(document).ready(function(){
       $('#newEntry form').submit(createEntry);
       $('#patientList li a').click(function(){
       var nameOffset = this.id;
       sessionStorage.currentName = nameOffset; // storing the clicked patient name
       refreshEntries();
      });

   // creating a database with name PatientDataBase and which has the table named patientRecord1

   var shortName = 'patientDataBase';
    var version = '1.0';
    var displayName = 'patientDataBase';
    var maxSize = 65536;
    db = openDatabase(shortName, version, displayName, maxSize);
    db.transaction(
       function(transaction) {
          transaction.executeSql(
             'CREATE TABLE IF NOT EXISTS patientRecord1 ' +
            '  (id INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT, ' +
            '  pName TEXT NOT NULL);'
              );
           }
        );
     });


  // Function created a new enty in the database table patientRecord1 
   function createEntry() {
         var pName = $('#PatientName').val();
         db.transaction(
         function(transaction) {
         transaction.executeSql(
         'INSERT INTO patientRecord1 (pName) VALUES (?);', 
          [pName], 
          function(){
           refreshEntries();
           jQT.goBack();
         }, 
        errorHandler
       );
     }
   );
    return false;
  }
      // this function is used to retrive the data from the table and populate in the html pannel named patientList

     function refreshEntries() {
      $('#patientList ul li:gt(0)').remove();
     db.transaction(
     function(transaction) {
          transaction.executeSql(
          'SELECT * FROM patientRecord1;', 
                 function (transaction, result) {
                 for (var i=0; i < result.rows.length; i++) {
                      var row = result.rows.item(i);
                      var newEntryRow = $('#entryTemplate').clone();
                      newEntryRow.removeAttr('id');
                      newEntryRow.removeAttr('style');
                      newEntryRow.data('entryId', row.id);
                      newEntryRow.appendTo('#patientList ul');
                     newEntryRow.find('.label').text(row.pName);
                  }
               }, 
       errorHandler
         );
     }
    ); 
   }

        function errorHandler(transaction, error) {
         alert('Oops. Error was '+error.message+' (Code '+error.code+')');
         return true;
     }

var jQT=new$.jQTouch({
});
var-db；
$（文档）.ready（函数（）{
$（“#新条目表单”）。提交（createEntry）；
$（“#patientList li a”）。单击（函数（）{
var namepoffset=this.id；
sessionStorage.currentName=nameOffset；//存储单击的患者姓名
刷新条目（）；
});
//创建名为PatientDataBase且表名为patientRecord1的数据库
var shortName='patientDataBase'；
变量版本='1.0'；
var displayName='patientDataBase'；
var maxSize=65536；
db=openDatabase（shortName、version、displayName、maxSize）；
数据库事务(
职能（事务）{
transaction.executeSql(
'如果不存在创建表patientRecord1'+
“（id整数非空主键自动递增，”+
'pName TEXT NOT NULL）；'
);
}
);
});
//函数在数据库表patientRecord1中创建了一个新条目
函数createEntry（）{
var pName=$（'#PatientName'）.val（）；
数据库事务(
职能（事务）{
transaction.executeSql(
'插入patientRecord1（pName）值（？）；'，
[pName]，
函数（）{
刷新条目（）；
jQT.goBack（）；
}, 
错误处理程序
);
}
);
返回false；
}
//此函数用于从表中检索数据并填充到名为patientList的html窗格中
函数refreshEntries（）{
$（“#patientList ul li:gt（0）”.remove（）；
数据库事务(
职能（事务）{
transaction.executeSql(
“从patientRecord1中选择*”，
功能（事务、结果）{
对于（var i=0；i

---

请告诉我哪里做错了

将refreshEntries（）函数替换为以下内容：

function refreshEntries() {
    $('#patientList ul li:gt(0)').remove();
    db.transaction(

    function(transaction) {
        transaction.executeSql('SELECT * FROM patientRecord1;', [], function(transaction, result) {
            for (var i = 0; i < result.rows.length; i++) {
                var row = result.rows.item(i);
                var newEntryRow = $('#entryTemplate').clone();
                newEntryRow.removeAttr('id');
                newEntryRow.removeAttr('style');
                newEntryRow.data('entryId', row.id);
                newEntryRow.appendTo('#patientList ul');
                newEntryRow.find('.label').text(row.pName);
            }
        }, errorHandler);
    });
}

函数刷新条目（）{
$（“#patientList ul li:gt（0）”.remove（）；
数据库事务(
职能（事务）{
executeSql（'SELECT*FROM patientRecord1；'，[]，函数（事务，结果）{
对于（var i=0；i

---

executeSql

的参数中缺少一个参数数组。我把新的代码放在一把小提琴里

只是一个建议。为什么要深入sql的本质呢。使用像lawnchair这样的包装器来为u。只需保存json并检索它。非常感谢您。在您回复后，我可以在患者名单上看到我的pName列表。你完全正确，我只是在executeSql的参数中缺少了param数组。我刚加上，[]，一切都开始工作了。再次感谢你

function refreshEntries() {
    $('#patientList ul li:gt(0)').remove();
    db.transaction(

    function(transaction) {
        transaction.executeSql('SELECT * FROM patientRecord1;', [], function(transaction, result) {
            for (var i = 0; i < result.rows.length; i++) {
                var row = result.rows.item(i);
                var newEntryRow = $('#entryTemplate').clone();
                newEntryRow.removeAttr('id');
                newEntryRow.removeAttr('style');
                newEntryRow.data('entryId', row.id);
                newEntryRow.appendTo('#patientList ul');
                newEntryRow.find('.label').text(row.pName);
            }
        }, errorHandler);
    });
}