I am trying to get values from database using ionic, ng-cordova, sqlite but i keep getting this error:

TypeError: Cannot read property 'transaction' of null: ionic.bundle.js:19387

Here is the code:

HTML

<ion-view view-title="Search" ng-controller="AppCtrl2">
  <ion-content>
    <ion-list>
      <ion-item ng-repeat="item in resultados">
        Hello, {{item}}!
      </ion-item>
    </ion-list>
  </ion-content>
</ion-view>

app.js

var db = null;

angular.module('starter', ['ionic', 'starter.controllers','ngCordova'])

.run(function($ionicPlatform,$cordovaSQLite) {
  $ionicPlatform.ready(function() {
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
    // for form inputs)
    if (window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }
    if (window.StatusBar) {
      // org.apache.cordova.statusbar required
      StatusBar.styleDefault();
    }
    db = $cordovaSQLite.openDB({ name: "my.db" });
    $cordovaSQLite.execute(db, "CREATE TABLE IF NOT EXISTS people (id integer primary key, firstname text, lastname text)");
    query = "INSERT INTO people (firstname, lastname) VALUES (?,?)";
    $cordovaSQLite.execute(db, query, ["Sumit", "Pal"]).then(function(res) {
        console.log("INSERT ID -> " + res.insertId);
      });
    $cordovaSQLite.execute(db, query, ["Sumti2", "Pal"]);
  });
})

controller

.controller('AppCtrl2', function($scope,$ionicPlatform,$cordovaSQLite) {

 $ionicPlatform.ready(function() {

    function getCat() {
      var selectQuery = "SELECT * FROM people";
      $cordovaSQLite.execute(db, selectQuery).then(function(result) {
      nombres = []; 
      for(var i=0; i<result.rows.length; i++){
          nombres.push({"nombre":result.rows.item(0).firstname});
        }
      })
    }
    $scope.resultados =  getCat();       
  })

});

How can i fix it ? The error could be of because device is not yet ready ?

I am trying to get values from database using ionic, ng-cordova, sqlite but i keep getting this error:

TypeError: Cannot read property 'transaction' of null: ionic.bundle.js:19387

Here is the code:

HTML

<ion-view view-title="Search" ng-controller="AppCtrl2">
  <ion-content>
    <ion-list>
      <ion-item ng-repeat="item in resultados">
        Hello, {{item}}!
      </ion-item>
    </ion-list>
  </ion-content>
</ion-view>

app.js

var db = null;

angular.module('starter', ['ionic', 'starter.controllers','ngCordova'])

.run(function($ionicPlatform,$cordovaSQLite) {
  $ionicPlatform.ready(function() {
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
    // for form inputs)
    if (window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }
    if (window.StatusBar) {
      // org.apache.cordova.statusbar required
      StatusBar.styleDefault();
    }
    db = $cordovaSQLite.openDB({ name: "my.db" });
    $cordovaSQLite.execute(db, "CREATE TABLE IF NOT EXISTS people (id integer primary key, firstname text, lastname text)");
    query = "INSERT INTO people (firstname, lastname) VALUES (?,?)";
    $cordovaSQLite.execute(db, query, ["Sumit", "Pal"]).then(function(res) {
        console.log("INSERT ID -> " + res.insertId);
      });
    $cordovaSQLite.execute(db, query, ["Sumti2", "Pal"]);
  });
})

controller

.controller('AppCtrl2', function($scope,$ionicPlatform,$cordovaSQLite) {

 $ionicPlatform.ready(function() {

    function getCat() {
      var selectQuery = "SELECT * FROM people";
      $cordovaSQLite.execute(db, selectQuery).then(function(result) {
      nombres = []; 
      for(var i=0; i<result.rows.length; i++){
          nombres.push({"nombre":result.rows.item(0).firstname});
        }
      })
    }
    $scope.resultados =  getCat();       
  })

});

How can i fix it ? The error could be of because device is not yet ready ?

• javascript
• angularjs
• sqlite
• cordova
• ionic-framework

Share Improve this question Follow asked Feb 2, 2015 at 13:10 ChuckyChucky 7511 gold badge22 silver badges1010 bronze badges 1

• I had the same issue and managed to resolve it: stackoverflow./a/31457046/2842657 – Elroy Commented Jul 16, 2015 at 14:30

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 2

Case you do test your app on Browser/Chrome for example, at windows Console (F12) to be error transaction of null, thats ok!!

For good test, you would deploy app ionic any device android or ios, or emulated avd.

Look my test github example ng-cordova sqlite SELECT and INSERT mands, good luck!

https://github./CharlesMendes/ionic-sqlite
and
https://github./CharlesMendes/andos-basicos

APP.js

$scope.select = function(lastname) {
        var query = "SELECT firstname, lastname FROM people WHERE lastname = ?";
        $cordovaSQLite.execute(db, query, [lastname]).then(function(res) {
            if(res.rows.length > 0) {
                var message = "SELECTED -> " + res.rows.item(0).firstname + " " + res.rows.item(0).lastname;
                alert(message);
                console.log(message);
            } else {
                alert("No results found");
                console.log("No results found");
            }
        }, function (err) {
            alert(err);
            console.error(err);
        });
    }

Deploy do app Android

ionic build android

Install apk your device/smartphone android for test

adb install -r platforms/android/ant-build/CordovaApp-debug.apk

I found the solution for this,

just declare your variable name above the function in index.js and hence it will load the DB name throughout the controller.

var myDB;
(function() {
    "use strict";

    document.addEventListener('deviceready', onDeviceReady.bind(this), false);

    function onDeviceReady() {

      // Handle the Cordova pause and resume events
      document.addEventListener('pause', onPause.bind(this), false);
      document.addEventListener('resume', onResume.bind(this), false);

      // TODO: Cordova has been loaded. Perform any initialization that requires Cordova here.
      var element = document.getElementById("deviceready");

      myDB = window.sqlitePlugin.openDatabase({
        name: "mySQLite.db",
        location: 'default'
      });
      element.innerHTML = 'Device Ready';
      element.className += ' ready';
    };
});

In Tutorials they have defined myDB within function

You can manually bootstrap the app after the platform is ready Initialize my angularJs App after Phonegap deviceready

Or you can first navigate to a static loading page, once all the initialization logic is plete in the platform ready method, then navigates to the first functional page

Do some changes.

1. Remove database connection from app.run(). Put that code in factory service

   dbConnection :function(){
       if (window.cordova) {
           dbconn = $cordovaSQLite.openDB({ name: "my.db" , location: 'default'}); 
           $cordovaSQLite.execute(dbconn, "CREATE TABLE IF NOT EXISTS people (id integer primary key, firstname text, lastname text)");
       }
       else{
           dbconn = window.openDatabase("my.db", '1', 'my', 1024 * 1024 * 100);
           $cordovaSQLite.execute(dbconn, "CREATE TABLE IF NOT EXISTS people (id integer primary key, firstname text, lastname text)");
       }
       return dbconn;
   }
   

2. Call your getCat() function on device ready.

   document.addEventListener("deviceready", onDeviceReady, false);
   function onDeviceReady() {
      $scope.resultados =  getCat();
   }
   

$cordovaSQLite.openDB now requires a pulsory location parameter. Change

db = $cordovaSQLite.openDB({ name: "my.db" });

to

db = $cordovaSQLite.openDB({ name: "my.db", location:"default" });