从Phonegap的SQLite数据库中提取数据

时间:2013-03-24 00:03:48

标签: javascript html sqlite cordova

我在PhoneGap应用程序中使用SQLite数据库。我能够填充数据库,提取数据库并使用console.log

打印它

这是代码

function extractFromDB(){
     var db = window.openDatabase("hospitalsDB", "1.0", "HospitalsDB", false);
     db.transaction(queryDB, errorCB);
}

  function queryDB(tx) {
     tx.executeSql('SELECT * FROM hospitals', [], querySuccess, errorCB);
 }

 function querySuccess(tx, results) {
     var len = results.rows.length;
     console.log("DEMO table: " + len + " rows found.");
     for (var i=0; i<len; i++){
            console.log("Row = " + i + " ID = " + results.rows.item(i).id + " Data =  " + results.rows.item(i).data);
      }
}

我的问题是,如何将这些数据打印到html页面上?

2 个答案:

答案 0 :(得分:3)

如果我以正确的方式得到您的问题。假设您的html页面中有<div>

var resultDiv = $('#mydiv');
var data = undefined;
for (var i=0; i<len; i++){
     data = "Row = " + i + " ID = " + results.rows.item(i).id + " Data =  " + results.rows.item(i).data;
     resultDiv.append(data + "<br>")

这会将所有数据写入html页面中的div。一个简单的例子对你的一个很简单:JSFIDDLE

答案 1 :(得分:1)

function querySuccess(tx, results) {
  <!-- its good programming to check the length of rows returned by sqlite DB.-->
     var htmlstring = "";
         if (results != null && results.rows != null && results.rows.length > 0) {
                for ( var i = 0;i <results.rows.length;i++)
                    {
    htmlstring+= '<div class="ui-grid-a">';
          htmlstring += '<div class="ui-block-a">'+results.rows.item(i).id+'</div>'; 
           htmlstring+= '</div>';  

                   }

$("#divholderfordata").empty().append(htmlstring).trigger('create');

          }
   else
 {console.log("no records inserted in DB");}
}

你可以在你的html代码中定义id为“divholderfordata”的“div”,就“UI”而言,这段代码会更好用,因为它还包含“jquery-mobile”代码 希望它会对你有所帮助。