Question

在我的应用程序的主页上，城市列表通过ajax调用加载到php，然后json返回到应用程序。我运行了很长时间没有问题，但现在我想保存数据库中返回的数据。

我得到了以下工作，适用于chrome，safari。但是..当我用phonegap构建它并将其加载到我的手机时......它没有。

  window.addEventListener('load', function () {
    document.addEventListener("deviceready", onDeviceReady, false);
  }, false);

  dbName = "database5";
  var database = null;
  function onDeviceReady(){
      database = window.openDatabase(dbName,"1.0", "247 Chiropractor", 5 * 1024 * 1024);
      database.transaction(PopulateDatabase, errorOpenDB, successOpenDB);
  }

我尽可能地调试了这个，无论如何使用警报，看看代码失败的地方。

在我的ajax for循环中失败了，我的执行sql事务就失败了。 tx.executeSql

      function PopulateDatabase(tx){
          tx.executeSql('CREATE TABLE IF NOT EXISTS `appCities` (`ac_id` INTEGER PRIMARY KEY AUTOINCREMENT,`ac_city1` TEXT, `ac_city2` TEXT, `ac_city3` TEXT, `ac_city4` TEXT, `ac_city5` TEXT, `ac_dateadded` TEXT)', AjaxError, AjaxSuccess);

        function AjaxError(){
            alert("AjaxError!");
        }

        function AjaxSuccess(tx){
            $.ajax({
                url: preURL+"getCities.php",
                //async : false,
                success: function(data){
                        var date = new Date();
                        var date = +date;
                        var timestamp = new Date(date);
                        for(i = 0;i < data.length; i++){
                            tx.executeSql("INSERT OR REPLACE INTO appCities VALUES("+data[i].ac_id+",'"+data[i].city1+"','','','','','"+timestamp+"')");
                        }

                        afterAjax();
                },
                error: function(data) {
                    $('#msgToUser').html('<br><h2 align="center">. .oops!. .</h2><p style="padding:10px">There was an error. It is possible that you may not have signal. Please connect to wifi or make sure you have cellular signal and restart this application. If you believe you recieved this error by mistake, please contact us</p>');
                }
            });
        }
      }

我尝试过异步false，但这会导致我的ajax调用失败并触发错误函数。

过去两天我花了大约10个小时试图让这个工作，我将不胜感激。

我有一个插件需要websql才能在iOS Phonegap上运行吗？

Answer 1

我在iOS / Android上的Phonegap / Cordova应用程序中使用了WebSQL。我通过回调使用操作链来执行顺序操作，这似乎在两个平台上都能正常工作。将此原则应用于您的代码，我会做这样的事情：

window.addEventListener('load', function () {
    document.addEventListener("deviceready", onDeviceReady, false);
}, false);

dbName = "database5";
var database = null;
var ajaxData = null;

function onDeviceReady(){
  database = window.openDatabase(dbName,"1.0", "247 Chiropractor", 5 * 1024 * 1024);
  doAjax();
}

function doAjax(){
    $.ajax({
         url: preURL+"getCities.php",
         //async : false,
         success: AjaxSuccess,
         error: function(data) {
             $('#msgToUser').html('<br><h2 align="center">. .oops!. .</h2><p style="padding:10px">There was an error. It is possible that you may not have signal. Please connect to wifi or make sure you have cellular signal and restart this application. If you believe you recieved this error by mistake, please contact us</p>');
         }
    });
}

function AjaxSuccess(data){
     ajaxData = data;
     database.transaction(CreateDatabase, errorOpenDB, successOpenDB);
}

function SqlError(){
     alert("SqlError!");
}

function CreateDatabase(tx){
     tx.executeSql('CREATE TABLE IF NOT EXISTS `appCities` (`ac_id` INTEGER PRIMARY KEY AUTOINCREMENT,`ac_city1` TEXT, `ac_city2` TEXT, `ac_city3` TEXT, `ac_city4` TEXT, `ac_city5` TEXT, `ac_dateadded` TEXT)', SqlError, CreateSuccess);
}

function CreateSuccess(tx){
     var date = new Date();
     var date = +date;
     var timestamp = new Date(date);
     doInserts(timestamp, tx);
}

function doInserts(timestamp, tx){
    if(ajaxData.length > 0{
        var data = ajaxData.shift();
        tx.executeSql("INSERT OR REPLACE INTO appCities VALUES("+data.ac_id+",'"+data.city1+"','','','','','"+timestamp+"')", SqlError, doInserts.bind(this, timestamp));

    }else{
        insertSuccess();
    }
}

function insertSuccess(){
    console.log("Insert successful");
    afterAjax();
}

关于Ajax成功的Phonegap WebSQL Transaction无法正常工作

1 个答案: