lundi 2 février 2015

Return More Than One Data with Ionic, SQLite

i am trying to retrive some data with sqlite from ionic framework. But i am newbie, so i need your help.


I want to retrieve data from db with sqlite as a list, all data.


If // console.log line command is open, i only get one data, not the others. If app.js is like this, i get this error.



TypeError: Cannot read property 'push' of undefined
at app.js:65
at processQueue (ionic.bundle.js:20962)
at ionic.bundle.js:20978
at Scope.$get.Scope.$eval (ionic.bundle.js:22178)
at Scope.$get.Scope.$digest (ionic.bundle.js:21994)
at Scope.scopePrototype.$digest (hint.js:1468)
at ionic.bundle.js:22216
at completeOutstandingRequest (ionic.bundle.js:12714)
at ionic.bundle.js:13094


app.js



var db = null;
var example = angular.module('starter', ['ionic', 'ngCordova'])

.run(function($ionicPlatform, $cordovaSQLite) {
$ionicPlatform.ready(function() {
if(window.cordova && window.cordova.plugins.Keyboard) {
cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
}
if(window.StatusBar) {
StatusBar.styleDefault();
}
if (window.cordova) {
db = $cordovaSQLite.openDB({ name: "my.db" }); //device
}else{
db = window.openDatabase("my.db", '1', 'my', 1024 * 1024 * 100); // browser
}

$cordovaSQLite.execute(db, "CREATE TABLE IF NOT EXISTS people (id integer primary key, firstname text, lastname text)");
});
});

example.controller("ExampleController", function($scope, $cordovaSQLite) {

$scope.insert = function(firstname, lastname) {
var query = "INSERT INTO people (firstname, lastname) VALUES (?,?)";

$cordovaSQLite.execute(db, query, [firstname, lastname]).then(function(result) {
console.log("INSERT ID -> " + result.insertId);
}, function (error) {
console.error(error);
});
}

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

$scope.selectAll = function() {
var query = "SELECT firstname, lastname FROM people";
var outputs = [];
$cordovaSQLite.execute(db, query, []).then(function(result) {
if(result.rows.length > 0) {
for(var i = 0; i < result.rows.length; i++) {
//console.log("SELECTED -> " + result.rows.item(i).firstname + " " + result.rows.item(i).lastname);
/* $scope.outputs = [
{"firstname": result.rows.item(i).firstname}
]; */

$scope.outputs.push({
"firstname" : result.rows.item(i).firstname,
});
}
} else {
console.log("No results found");
}
}, function (error) {
console.error(error);
});
}

});

example.controller("PeopleCtrl", function($scope) {
$scope.people = [
{firstName: 'John', lastName: 'Doe', address: {city: 'Chandler', state: 'AZ', zip: 85248}},
{firstName: 'Jane', lastName: 'Doe', address: {city: 'Chandler', state: 'AZ', zip: 85248}},
{firstName: 'Johnny', lastName: 'Doe', address: {city: 'Phoenix', state: 'AZ', zip: 85003}}
];
});


and index.html



<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<title></title>
<link href="lib/ionic/css/ionic.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="js/ng-cordova.min.js"></script>
<script src="cordova.js"></script>
<script src="js/app.js"></script>
</head>
<body ng-app="starter">

<ion-pane>
<ion-header-bar class="bar-stable">
<h1 class="title">Ionic Blank Starter</h1>
</ion-header-bar>
<ion-content>

<div ng-controller="ExampleController">
<button class="button" ng-click="insert('Arzu','Acar')">Insert</button>
<button class="button" ng-click="selectAll()">Select</button>

<ul>
<li ng-repeat="output in outputs">
<span class="bold">{{output.firstname}}</span>
</li>
</ul>
</div>

<div ng-controller="PeopleCtrl">
<div id="peopleContainer">
People:<br /><br />
<ul>
<li ng-repeat="person in people">
<span class="bold">{{person.firstName}} {{person.lastName}}</span>
<br />
{{person.address.city}}, {{person.address.state}}&nbsp;&nbsp;{{person.address.zip}}
</li>
</ul>
</div>
</div>
</ion-content>
</ion-pane>
</body>
</html>


Thank you.


Aucun commentaire:

Enregistrer un commentaire