Security_ERR: DOM Exception 18 openDatabase() using Phonegap

Question

I have created and HTML5/JQuery project using phonegap template. I am trying to store information on local database. Currently, I am using the simulator ElectricMobileStudio2012 in order to test. I am receiving the error "Security_ERR: DOM Exception 18" on this line of code:

var db = window.openDatabase("MobileInspection", "1.0", "Mobile Inspection Database", 200000);

Here is my code. I have been stuck on this for days and I even tried using these lines of code to get around the error:

navigator.openDatabase = window.openDatabase = DroidDB_openDatabase;

window.droiddb = new DroidDB();

---

Here is my code:

function SaveUserInfoLocally(data) {
    try {
        var rememberMe = $('#chkRememberMe').is(':checked')
        if (rememberMe) {
            // TODO: Save user details in local db.
            //navigator.openDatabase = window.openDatabase = DroidDB_openDatabase;
            //window.droiddb = new DroidDB();
            var db = window.openDatabase("MobileInspection", "1.0", "Mobile Inspection Database", 200000);
            db.transaction(populateUsersTable, errorCB, successCB);
            db.transaction(queryDB, errorCB);
        }
    }
    catch (error) {
        alert(error);
    }
}

function populateUsersTable(tx) {
    try {
        var userName = window.localStorage.getItem("UserName");
        var firstName = window.localStorage.getItem("FirstName");
        var lastName = window.localStorage.getItem("LastName");
        //alert(userName + " " + firstName + " " + lastName);
        tx.executeSql("DROP TABLE IF EXISTS UserDetails");
        tx.executeSql("CREATE TABLE IF NOT EXISTS UserDetails (UserName, FirstName, LastName)");
        tx.executeSql("INSERT INTO UserDetails (UserName, FirstName, LastName) VALUES ('" + userName + "', '" + firstName + "', '" + lastName + "')");
        alert("populate");
    }
    catch (exception) {
        alert(exception);
    }
}

function errorCB(err) {
    alert("Error processing: " + err);
}

function successCB() {
    alert("success!"); 
}

function queryDB(tx) {
    try {
        tx.executeSql('SELECT * FROM UserDetails', [], querySuccess, errorCB);
    }
    catch (exception) {
        alert(exception);
    }
}

// Testing
function querySuccess(tx, results) {
    try {
        if (results) {
            alert("records");
        }
        else {
            alert(results);
        }
    }
    catch (exception) {
        alert(exception);
    }
}

Answer 1

I had a similar issue - hence me stumbling across this issue.

Make sure that all localstorage calls executes within the deviceready block:

document.addEventListener("deviceready", onDeviceReady, false);

function onDeviceReady() {
    //do ALL your localstorage stuff here
}