使用返回的JSON填充数据库表

时间:2013-07-10 20:20:37

标签: jquery ajax json jquery-mobile cordova

我希望将一些来自Drupal网站的JSON内容存储到PhoneGap应用程序中的数据库表中。我正在使用ajax来做到这一点。当我运行以下代码并检查表时,我被告知它是空的。有人知道如何填充这张桌子吗?

$('#newDiv').live('pageshow',function(){

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

    function querySuccess(tx, results) {
        var len = results.rows.length;
        alert("Table: " + len + " rows were found.");
        }
    }

    function createTable(tx) {

        tx.executeSql('DROP TABLE IF EXISTS "tableA"');
        var sql = "CREATE TABLE IF NOT EXISTS 'tableA' (id INTEGER PRIMARY KEY AUTOINCREMENT, step VARCHAR(50), text VARCHAR(50))";
        tx.executeSql(sql, [], successCB, errorCB); 
    }

    db.transaction(createTable, errorCB, successCB);

   $.ajax({
        url: myURL,
        type: 'post',
        data: 'tid=4',
        dataType: 'json',
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert('new_page_node_view - failed to retrieve page node');
            console.log(JSON.stringify(XMLHttpRequest));
            console.log(JSON.stringify(textStatus));
            console.log(JSON.stringify(errorThrown));
        },     
        success: function (data) {

            $.each(data, function (node_index,node_value) {
               db.transaction(function(tx){
                       tx.executeSql("INSERT INTO 'tableA' (step, text) VALUES (?, ?)",[node_value.title, node_value.body]);
               });
            });
          }
      });

    db.transaction(queryDB, errorCB, successCB);


});

1 个答案:

答案 0 :(得分:4)

嘿tipssch尝试这个 -

  var numInserts = 0;

  $.ajax({
        url: myURL,
        type: 'post',
        data: 'tid=4',
        dataType: 'json',
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert('new_page_node_view - failed to retrieve page node');
            console.log(JSON.stringify(XMLHttpRequest));
            console.log(JSON.stringify(textStatus));
            console.log(JSON.stringify(errorThrown));
        },     
        success: function (data) {
            numInserts = data.length; // num of inserts to expect (assumes data is in array of objects)

            $.each(data, function (node_index,node_value) {
               db.transaction(function(tx){
                       tx.executeSql("INSERT INTO 'tableA' (step, text) VALUES (?, ?)",[node_value.title, node_value.body],
                       function(tx, results){
                            numInserts--; // decrement 1 from expected num of inserts
                            if (numInserts == 0){
                                db.transaction(queryDB, errorCB, successCB);
                            }
                       }, 
                       function(tx, err){
                        console.log("insert error");
                        if (err){
                            console.log(err);
                        }
                       });
               });
            });
        }
  });

/更新 - 回答为何需要采用上述方法。

好的,所以你可能想知道为什么你不会在$ .each循环之后立即调用queryDB成功回调AJAX调用,如下所示 -

   $.ajax({
        url: myURL,
        type: 'post',
        data: 'tid=4',
        dataType: 'json',
        error: function (XMLHttpRequest, textStatus, errorThrown) {
            alert('new_page_node_view - failed to retrieve page node');
            console.log(JSON.stringify(XMLHttpRequest));
            console.log(JSON.stringify(textStatus));
            console.log(JSON.stringify(errorThrown));
        },     
        success: function (data) {
            $.each(data, function (node_index,node_value) {
               db.transaction(function(tx){
                    tx.executeSql("INSERT INTO 'tableA' (step, text) VALUES (?, ?)",[node_value.title, node_value.body]);
               });
            });
            db.transaction(queryDB, errorCB, successCB); // <-- the inserts could not all be finished when this gets called
        }
   });

假设您要从JSON结果中插入1000条记录。在AJAX调用成功调用db.transaction(queryDB, errorCB, successCB);时,这些插入将无法完成。您必须实现对tx.executeSql插入的成功回调,以了解插入何时完成。

我在上面的第一个方法中所做的是允许在调用queryDB函数之前完全完成所有插入。我添加了内联成功并且无法回调tx.executeSql("INSERT INTO 'tableA' (step, text) VALUES (?, ?)",[node_value.title, node_value.body]);。我总是建议为PhoneGap中的任何WebSQL执行此操作(它们也不必内联)。

我在上一份工作期间在PhoneGap中做了大量的WebSQL事务。其中大部分涉及循环JSON并将其写入本地数据库表。真正困难的问题发生在你有许多插入并试图弄清楚它们何时完全完成之后才通知用户,或者在你的情况下拉出刚写完的数据。

所以......在插入的情况下你将学习的技巧是 -

  
      
  1. 计算您希望执行的插入次数,并将其存储在变量中。
  2.   
  3. tx.executeSql插入的成功回调中,从您的变量中减去1,该变量包含您期望的插入数。
  4.   
  5. 一旦变量在tx.executeSql成功回调中变为0,那么您就知道所有插入都已完成。
  6.   

简单示例,包含1个插入 -

// wrong approach here
db.transaction(function(tx){
    tx.executeSql("INSERT INTO 'tableA' (step, text) VALUES (?, ?)",["foo", "bar"]);
    // it will start the select query before the insert has completed
    tx.executeSql("SELECT * FROM 'tableA'", [], querySuccess, errorCB);
});

// the right approach here
db.transaction(function(tx){
    tx.executeSql("INSERT INTO 'tableA' (step, text) VALUES (?, ?)",["foo", "bar"], insertDone, insertFail);
});

function insertDone(tx, results){
    // insert is done, now you can run the queryDB
    tx.executeSql("SELECT * FROM 'tableA'", [], querySuccess, errorCB);
}

function insertFail(tx, err){
    console.log("insert error");
    if (err){
        console.log(err);
    }
}

我希望这有助于澄清为什么我使用第一种方法而不是在AJAX调用的成功回调中运行queryDB

希望所有这些都能帮助将来的人,哈哈。