index.html
<div class="test" ng-controller="Ctrl">
<button ng-click="removeTask(10);">remove</button>
<div>
app.js
app.controller('Ctrl', function($scope) {
$scope.removeTask = function(taskId) {
alert("Task Id is " + taskId);
};
var statement = "";
db.transaction(function (tx) {
//tx.executeSql('DROP TABLE IF EXISTS test_table');
statement = "select * from objects where o.TYPES=' + taskId' GROUP BY objectid";
The alert message work perfectly, but when I try to use the variable taskId on select statement it does not work.
app.controller('Ctrl', function($scope) {
$scope.removeTask = function(taskId){
alert("Task Id is "+taskId);
$scope.taskId = taskId;
};
var statement = "";
db.transaction(function (tx) {
//tx.executeSql('DROP TABLE IF EXISTS test_table');
statement = "select * from objects where o.TYPES='+$scope.taskId+' GROUP BY objectid";
Note that you must assign the task id to a scope variable to use it later.
You need to make the db transaction inside the function.
app.controller('Ctrl', function($scope) {
var statement = "";
$scope.removeTask = function(taskId) {
alert("Task Id is " + taskId);
db.transaction(function (tx) {
//tx.executeSql('DROP TABLE IF EXISTS test_table');
statement = "select * from objects where o.TYPES='+taskId' GROUP BY objectid";
};
};
Function arguments such as taskId are available only inside the function.
Related
I am running into a peculiar problem.
I have a my view of drop down list as this in HTML:
<div ng-controller='ConfigurableInputController as configurableInput'>
<select class="fixed-input"
ng-model="configurableInput.selectedCriteria"
ng-change="configurableInput.update()"
ng-options="criterion.selected as criterion.name for criterion in configurableInput.criteriaList">
<option value="">--Please select the comparison criteria--</option>
</select>
The above shows me 3 options in drop down list: Store, Channel and Permissions.
When ever I change the option from Store to Channel or Permissions or any combination the view changes (input boxes, certain labels etc.)
My update() method in controller does this:
configurableInput.update = function () {
configurableInput.permission = "";
configurableInput.id1 = "";
configurableInput.id2 = "";
configurableInput.items1 = "";
configurableInput.items2 = "";
configurableInput.defaultValueArray = [];
configurableInput.permissionsArr = [];
}
On selection of the drop down item, I do a ng-click on a button which retrieves information from Db.
There are 2 flavors of methods which are called on ng-click but the one giving me trouble is this one in the Service method:
StoreConfigurableService.$inject = ['$q', '$http', 'ApiBasePath'];
function ConfigurableService($q, $http, ApiBasePath) {
var service = this;
var defaultValueArr = [];
var permissionsArr = [];
var items1 = "";
var items2 = "";
service.retrievePermissions = function (criterion, id1, id2, rlNumber1, rlNumber2) {
$q.all([
$http.get(ApiBasePath + "/" + criterion + "/" + id1 + "/" + rlNumber1),
$http.get(ApiBasePath + "/" + criterion + "/" + id2 + "/" + rlNumber2)
])
.then(function (response) {
items1 = response[0].data;
items2 = response[1].data;
if (criterion === 'Permissions') {
var processed = false;
permissionsArr = makePermissionsArray(permissionsArr, items1, items2, processed);
}
})
.catch(function (errorResponse) {
console.log("Error: " + errorResponse);
throw errorResponse;
});
};
... so on
In my makePermissionsArray() I am doing this:
function makePermissionsArray(arr, items1, items2, processed) {
var map = items1.storePermissions;
var map2 = items2.storePermissions;
var map3 = items1.allPermissions;
for (var key in map) {
arr.push({
'code': key,
'description': map3[key],
'repStorePermission1': map[key],
'repStorePermission2': map2[key]
});
}
}
I get this permissionsArr back to controller through this:
service.getPermissionsArr = function () {
return permissionsArr;
};
NOTE that 'arr' in the argument of method makePermissionsArray() is not initialized because I am getting it by passing permissionsArr in the argument.
Now how the flow goes is:
First I select Store from drop down list, click on button to retrieves configurables for the store. This gives me correct response.
Then I select 'Permissions' from drop down list, click on button to retrieve permission configurables from Db, it gets stuck and does not get me any response.
I thought I am not clearing the arrays correctly in update() method and after some long search I found and changed these array initializing from:
configurableInput.defaultValueArray = [];
configurableInput.permissionsArr = [];
to
configurableInput.defaultValueArray.length = 0;
configurableInput.permissionsArr.length = 0;
in my update() method.
Now what happens is this:
First I select Store from drop down list, click on button to retrieves configurables for the store. This gives me correct response.
Then I select 'Permissions' from drop down list, click on button to retrieves permission configurables from Db, it gives me correct response.
I select Store from drop down list again, click on button and I get correct response.
But when I again select 'Permissions' from drop down list, click on button, it gives me this error - TypeError: Cannot read property 'push' of undefined
Error I get is at this point:
arr.push({
'code': key,
'description': map3[key],
'repStorePermission1': map[key],
'repStorePermission2': map2[key]
});
I am literally tearing my hair out because of this problem. Can someone please help me what's wrong?
I need to execute a function inside ng-repeat to convert date. How can i parse a angular result in a function?
Field name in database is dataf
I tried diferent ways but no one works...
<tr ng-repeat="detail in details| filter:search_query">
<td><b>{{detail.nom}}</b></td>
<td>{{detail.descripcio}}</td>
<td>{{datareves(detail.datafet) }} </td>
<td>{{detail.visible}}</td>
and
getInfo();
function getInfo(){
$http.post('empDetails.php').success(function(data){
$scope.details = data;
});
}
$scope.datareves = function(details.datafet) {
var res = dataf.split(" ");
var res2 = res[0].split("-");
var final = res2[2] + "-" + res2[1] + "-" + res2[0];
return (final);
};
Your function should look like this
$scope.datareves = function(dataf) {
var res = dataf.split(" ");
var res2 = res[0].split("-");
var final = res2[2] + "-" + res2[1] + "-" + res2[0];
return (final);
};
notice the change to the first line. The name of the variable you used in the function was not the same as the name being passed into the function.
You can read more about javascript function definitions here https://www.w3schools.com/js/js_function_definition.asp
I am using bramski/angular-indexedDB in my application. Basic CRUD operations are working fine, but the custom queries are not working as expected.
I am using the code
angular.module('myModuleName', ['indexedDB'])
.config(function ($indexedDBProvider) {
$indexedDBProvider
.connection('myIndexedDB')
.upgradeDatabase(1, function(event, db, tx){
var objStore = db.createObjectStore('people', {keyPath: 'ssn'});
objStore.createIndex('name_idx', 'age', {unique: false});
objStore.createIndex('name_idx, age_idx', ['name', 'age'] , {unique: false});
});
Basic query operations are working like follows
$indexedDB.openStore('people', function(x){
var find = x.query();
find = find.$eq('John');
find = find.$index("name_idx");
x.eachWhere(find).then(function(e){
$scope.list= e;
});
});
which results following query.
select * from people where name='John'
But, in the above scenario how we can execute custom quires like
select * from people where name='John' and age='25';
delete from people where name='John' and age='25';
The library you are using doesn't have complex queries, however you can write a pure-js solution for it, similar to this:
First you need to define your index as:
objStore.createIndex('name_age_idx', ['name', 'age'] , {unique: false});
Then you can have a search query for only those values that match the search result
searchIndexedDB = function (name, age, callback) {
var request = indexedDB.open(dbName);
request.onsuccess = function(e) {
var db = e.target.result;
var trans = db.transaction(objectStoreName, 'readonly');
var store = trans.objectStore(objectStoreName);
var index = store.index('name_age_idx');
var keyRange = IDBKeyRange.only([name, age]);
// open the index for all objects with the same name and age
var openCursorRequest = index.openCursor(keyRange);
openCursorRequest.onsuccess = function(e) {
let result = e.target.result;
// first check if value is found
if(result){
callback(result.value); // your callback will be called per object
// result.delete() - to delete your object
result.continue(); // to continue itterating - calls the next cursor request
}
};
trans.oncomplete = function(e) {
db.close();
};
openCursorRequest.onerror = function(e) {
console.log("Error Getting: ", e);
};
};
request.onerror = myStorage.indexedDB.onerror;
}
If you need a range from and too index, all you need is change the keyrange to:
var keyRange = IDBKeyRange.bound([name,fromAge], [value, toAge]);
I am trying to create a service which holds values that I want to be able to update from other controllers. It's a fake financial tracker which allows me to update the values in this service. I can't get it to work and I know I may be setting it up incorrectly. Can someone help me out with this?
My code:
(function () {
"use strict";
var Bkbank = angular.module('Bkbank' []);
Bkbank.controller('dashboardCtlr', function ($scope, dashboardSrvs) {
/*User Data*/
$scope.userName = dashboardSrvs.userName;
$scope.acctNum = dashboardSrvs.acctNum;
$scope.startDate = dashboardSrvs.startDate;
$scope.checkingsTotal = dashboardSrvs.checkingsTotal;
$scope.savingsTotal = dashboardSrvs.savingsTotal;
$scope.investTotal = dashboardSrvs.investTotal;
$scope.ouncesUpdate = dashboardSrvs.ouncesUpdate;
$scope.debtBalance = dashboardSrvs.debtBalance;
$scope.goldSpot = dashboardSrvs.goldSpot;
/*Section Titles*/
$scope.userTitle = dashboardSrvs.userTitle;
$scope.servicesTitle = dashboardSrvs.servicesTitle;
$scope.checkingsTitle = dashboardSrvs.checkingsTitle;
$scope.savingsTitle = dashboardSrvs.savingsTitle;
$scope.investTitle = dashboardSrvs.investTitle;
$scope.debtTitle = dashboardSrvs.debtTitle;
$scope.savingsUpdateTitle = dashboardSrvs.savingsUpdateTitle;
});
Bkbank.service('dashboardSrvs', function () {
/*User Data*/
this.userName = "Tim Willson";
this.acctNum = 554887;
this.startDate = "01/12/75";
this.checkingsTotal = "56458.00";
this.savingsTotal = "98187.00";
this.investTotal = "34143.00";
this.ouncesUpdate = "30";
this.debtBalance = "10000.00";
this.goldSpot = "1138.10";
/*Section Titles*/
this.userTitle = "User";
this.servicesTitle = "Financial Services";
this.checkingsTitle = "Checkings";
this.savingsTitle = "Savings";
this.investTitle = "Investments";
this.debtTitle = "debt";
this.savingsUpdateTitle = "Update Savings Account";
});
}());
I am not fully clear with the question you have asked but what I understood is you want to get/set attribute values into service so that updates available to all the consumer controller(s). In such scenario you can create service as e.g.
app.service('dashboardSrvs', function() {
var userName = "Tim Willson"; //Set some default Value
return {
get userName() {
return userName;
},
set userName(val) {
userName = val;
}
}
});
And inside the controller you can update the userName as -
testService.userName = 'Mike Tyson';
Angular merge to the rescue!
I advise you in advance to read this great article about Angular copy / extend / merge objects. Article link here
var demoApp = angular.module("demoApp", []);
demoApp.service("dashboardService", function () {
var configObj = {
"userData": {
"userName": "A",
"acctNum": "B",
"startDate": "C"
}
};
return configObj;
});
demoApp.controller("appController", function ($scope, dashboardService) {
// Override the new values of the service with a new object
var newConfigValues = {
"userData": {
"userName": "X",
"acctNum": "Z"
}
};
var newConfigObj = angular.merge({}, dashboardService, newConfigValues);
console.log(newConfigObj); // "userName": "X", "acctNum": "Z", "startDate": "C"
});
As you can see, you can override all or just some values. If you do the latter, the original values in your service will be kept.
JSFiddle here
I am trying to run a forEach function with data from a query and I want to set a variable for each object in that data to be able to use in a ng-repeat. I keep overriding the variable and cannot wrap my head around setting the variable for each one.
CategoryCardService.query({}, function (data) {
$scope.categoryCards = data;
angular.forEach(data, function (value) {
var categoryOccupancyPercent = $filter('number')(value.occupancy_percent * 100, 0);
var categoryTotalTurnover = value.total_turnover;
var doughnut_chart_min = 0;
var doughnut_chart_max = 0;
doughnut_chart_min = categoryOccupancyPercent;
doughnut_chart_max = 100 - categoryOccupancyPercent;
data.doughnutData = [doughnut_chart_min, doughnut_chart_max];
data.display = categoryOccupancyPercent + '%';
});
});
Pass in the key and assign like that.
CategoryCardService.query({}, function (data) {
$scope.categoryCards = data;
angular.forEach(data, function (value, key) {
// ...
data[key].display = categoryOccupancyPercent + '%';
});
});