Home Ask Login Register

Developers Planet

Your answer is one click away!

Splycd February 2016

Entering data with WebSQL

I'm having some trouble using WebSQL for my Chrome Extension. (This is my first time using it) I found this tutorial and am trying to adapt it to my needs: http://www.html5rocks.com/en/tutorials/webdatabase/todo/

Heres my code:

var favourites = {};
favourites.webdb = {};

favourites.webdb.db = null;

favourites.webdb.open = function () {
  var dbSize = 5 * 1024 * 1024; // 5MB
  favourites.webdb.db = openDatabase("favourites", "1", "Favourites Database", dbSize);
};

favourites.webdb.onError = function(tx, e) {
  alert("There has been an error: " + e.message);
};

favourites.webdb.onSuccess = function(tx, r) {
  // re-render the data.
  // loadTodoItems is defined in Step 4a
  favourites.webdb.getAllTiles(loadTiles);
};


favourites.webdb.createTable = function() {
  var db = favourites.webdb.db;
  db.transaction(function(tx) {
    tx.executeSql("CREATE TABLE IF NOT EXISTS " +
                  "tiles(ID INTEGER PRIMARY KEY ASC, name, colour, width, linkURL, imgURL)", []);
  });
};


favourites.webdb.addTile = function(tileName, tileColour, tileWidth, tileLinkURL, tileImgURL) {
  var db = favourites.webdb.db;
  db.transaction(function(tx){
    tx.executeSql("INSERT INTO tiles(name, colour, width, linkURL, imgURL) VALUES (?,?,?,?,?)",
        [tileName, tileColour, tileWidth, tileLinkURL, tileImgURL],
        favourites.webdb.onSuccess,
        favourites.webdb.onError);
   });
};

function loadTiles(tx, rs) {
  var rowOutput = "";
  var todoItems = document.getElementById("tiles");
  for (var i=0; i < rs.rows.length; i++) {
    rowOutput += renderTile(rs.rows.item(i));
  }

  tiles.innerHTML = rowOutput;
}
function renderTile(row) {
  return "<a href='" + row.tileLinkURL + "'>" +
      "<div class='mdl-js-button mdl-js-ripple-effect tile' style='background-color:" + row.tileColour + "; width:" + row.tileWidth + "px;'>" +
      "<img class        

Answers


Matthias Huttar February 2016

My first guess would be, that favourites.webdb.db === null and therefore does not have a method transaction.

For that reason, I would check if init is actually invoked. (If so, then check if the verison parameter of openDatabase is correct. In the docs I find, it should rather be "1.0" than just "1".

Post Status

Asked in February 2016
Viewed 1,209 times
Voted 10
Answered 1 times

Search




Leave an answer


Quote of the day: live life