Calculate the total amount using AngularJS
1
I'm trying to calculate the total amount using AngularJS.
want to calculate the total amount spent which is highlighted in above image.
Any Help would be appreciated.
My HTML:-
<body ng-app="nombre">
<div class="container">
<div class="row">
<div class="col-12">
<form class="row" id="nombre">
<div class="input-group mb-3">
<input type="text" class="form-control col-9" id="Spentfor" name="Spentfor" placeholder="Spent for">
<input type="text" class="form-control col-3" id="SpentAmount" name="SpentAmount" placeholder="Spent Amount">
<div class="input-group-append">
<button id="add" class="btn" type="submit">Add</button>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="container" ng-controller="budgetCtrl">
<div class="row list" ng-repeat="kasu in panam">
<div class="col-6"> kasu.title </div>
<div class="col-6 text-right total">
kasu.spent
</div>
</div>
<div class="row">
<div class="col-6"> Total Money spend </div>
<div class="col-6 overalltotal"> getTotal() </div>
</div>
</div>
</body>
My JS:-
var nombre = angular.module('nombre', ['ngRoute', 'firebase']);
nombre.controller('budgetCtrl', ['$scope', 'money', '$firebaseObject', function($scope, money, $firebaseObject)
money.then(function(data)
$scope.cash = data;
// $scope.pisa = data.desktop;
);
var ref = firebase.database().ref();
$scope.panam = $firebaseObject(ref);
var pa = $scope.panam;
$("#nombre").submit(function()
$(this), console.log("Submit to Firebase");
var Spentfor = $("#Spentfor").val(),
SpentAmount = $("#SpentAmount").val(),
total = title: Spentfor, spent: SpentAmount;
alert(total);
return ref.push().set(total).then(function()
$("#Spentfor, #SpentAmount").val("");
);
);
$scope.getTotal = function()
// edit here
]);
nombre.factory('money', ['$http', function($http)
return $http.get('budget.json')
.then(function(response)
return data = response.data;
, function(error)
alert('error');
);
]);
im trying to get it done through.
$scope.getTotal = function()
Above data is called from firebase. I'm trying to calculate the total amount spent using AngularJS. Any help would be appreciated.
javascript jquery html angularjs math
asked Nov 13 '18 at 10:54
karthick ravindranathkarthick ravindranath
313
add a comment |
1
I'm trying to calculate the total amount using AngularJS.
want to calculate the total amount spent which is highlighted in above image.
Any Help would be appreciated.
My HTML:-
<body ng-app="nombre">
<div class="container">
<div class="row">
<div class="col-12">
<form class="row" id="nombre">
<div class="input-group mb-3">
<input type="text" class="form-control col-9" id="Spentfor" name="Spentfor" placeholder="Spent for">
<input type="text" class="form-control col-3" id="SpentAmount" name="SpentAmount" placeholder="Spent Amount">
<div class="input-group-append">
<button id="add" class="btn" type="submit">Add</button>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="container" ng-controller="budgetCtrl">
<div class="row list" ng-repeat="kasu in panam">
<div class="col-6"> kasu.title </div>
<div class="col-6 text-right total">
kasu.spent
</div>
</div>
<div class="row">
<div class="col-6"> Total Money spend </div>
<div class="col-6 overalltotal"> getTotal() </div>
</div>
</div>
</body>
My JS:-
var nombre = angular.module('nombre', ['ngRoute', 'firebase']);
nombre.controller('budgetCtrl', ['$scope', 'money', '$firebaseObject', function($scope, money, $firebaseObject)
money.then(function(data)
$scope.cash = data;
// $scope.pisa = data.desktop;
);
var ref = firebase.database().ref();
$scope.panam = $firebaseObject(ref);
var pa = $scope.panam;
$("#nombre").submit(function()
$(this), console.log("Submit to Firebase");
var Spentfor = $("#Spentfor").val(),
SpentAmount = $("#SpentAmount").val(),
total = title: Spentfor, spent: SpentAmount;
alert(total);
return ref.push().set(total).then(function()
$("#Spentfor, #SpentAmount").val("");
);
);
$scope.getTotal = function()
// edit here
]);
nombre.factory('money', ['$http', function($http)
return $http.get('budget.json')
.then(function(response)
return data = response.data;
, function(error)
alert('error');
);
]);
im trying to get it done through.
$scope.getTotal = function()
Above data is called from firebase. I'm trying to calculate the total amount spent using AngularJS. Any help would be appreciated.
javascript jquery html angularjs math
asked Nov 13 '18 at 10:54
karthick ravindranathkarthick ravindranath
313
add a comment |
1
1
1
I'm trying to calculate the total amount using AngularJS.
want to calculate the total amount spent which is highlighted in above image.
Any Help would be appreciated.
My HTML:-
<body ng-app="nombre">
<div class="container">
<div class="row">
<div class="col-12">
<form class="row" id="nombre">
<div class="input-group mb-3">
<input type="text" class="form-control col-9" id="Spentfor" name="Spentfor" placeholder="Spent for">
<input type="text" class="form-control col-3" id="SpentAmount" name="SpentAmount" placeholder="Spent Amount">
<div class="input-group-append">
<button id="add" class="btn" type="submit">Add</button>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="container" ng-controller="budgetCtrl">
<div class="row list" ng-repeat="kasu in panam">
<div class="col-6"> kasu.title </div>
<div class="col-6 text-right total">
kasu.spent
</div>
</div>
<div class="row">
<div class="col-6"> Total Money spend </div>
<div class="col-6 overalltotal"> getTotal() </div>
</div>
</div>
</body>
My JS:-
var nombre = angular.module('nombre', ['ngRoute', 'firebase']);
nombre.controller('budgetCtrl', ['$scope', 'money', '$firebaseObject', function($scope, money, $firebaseObject)
money.then(function(data)
$scope.cash = data;
// $scope.pisa = data.desktop;
);
var ref = firebase.database().ref();
$scope.panam = $firebaseObject(ref);
var pa = $scope.panam;
$("#nombre").submit(function()
$(this), console.log("Submit to Firebase");
var Spentfor = $("#Spentfor").val(),
SpentAmount = $("#SpentAmount").val(),
total = title: Spentfor, spent: SpentAmount;
alert(total);
return ref.push().set(total).then(function()
$("#Spentfor, #SpentAmount").val("");
);
);
$scope.getTotal = function()
// edit here
]);
nombre.factory('money', ['$http', function($http)
return $http.get('budget.json')
.then(function(response)
return data = response.data;
, function(error)
alert('error');
);
]);
im trying to get it done through.
$scope.getTotal = function()
Above data is called from firebase. I'm trying to calculate the total amount spent using AngularJS. Any help would be appreciated.
javascript jquery html angularjs math
asked Nov 13 '18 at 10:54
karthick ravindranathkarthick ravindranath
313
I'm trying to calculate the total amount using AngularJS.
want to calculate the total amount spent which is highlighted in above image.
Any Help would be appreciated.
My HTML:-
<body ng-app="nombre">
<div class="container">
<div class="row">
<div class="col-12">
<form class="row" id="nombre">
<div class="input-group mb-3">
<input type="text" class="form-control col-9" id="Spentfor" name="Spentfor" placeholder="Spent for">
<input type="text" class="form-control col-3" id="SpentAmount" name="SpentAmount" placeholder="Spent Amount">
<div class="input-group-append">
<button id="add" class="btn" type="submit">Add</button>
</div>
</div>
</form>
</div>
</div>
</div>
<div class="container" ng-controller="budgetCtrl">
<div class="row list" ng-repeat="kasu in panam">
<div class="col-6"> kasu.title </div>
<div class="col-6 text-right total">
kasu.spent
</div>
</div>
<div class="row">
<div class="col-6"> Total Money spend </div>
<div class="col-6 overalltotal"> getTotal() </div>
</div>
</div>
</body>
My JS:-
var nombre = angular.module('nombre', ['ngRoute', 'firebase']);
nombre.controller('budgetCtrl', ['$scope', 'money', '$firebaseObject', function($scope, money, $firebaseObject)
money.then(function(data)
$scope.cash = data;
// $scope.pisa = data.desktop;
);
var ref = firebase.database().ref();
$scope.panam = $firebaseObject(ref);
var pa = $scope.panam;
$("#nombre").submit(function()
$(this), console.log("Submit to Firebase");
var Spentfor = $("#Spentfor").val(),
SpentAmount = $("#SpentAmount").val(),
total = title: Spentfor, spent: SpentAmount;
alert(total);
return ref.push().set(total).then(function()
$("#Spentfor, #SpentAmount").val("");
);
);
$scope.getTotal = function()
// edit here
]);
nombre.factory('money', ['$http', function($http)
return $http.get('budget.json')
.then(function(response)
return data = response.data;
, function(error)
alert('error');
);
]);
im trying to get it done through.
$scope.getTotal = function()
Above data is called from firebase. I'm trying to calculate the total amount spent using AngularJS. Any help would be appreciated.
javascript jquery html angularjs math
javascript jquery html angularjs math
asked Nov 13 '18 at 10:54
karthick ravindranathkarthick ravindranath
313
asked Nov 13 '18 at 10:54
karthick ravindranathkarthick ravindranath
313
asked Nov 13 '18 at 10:54
karthick ravindranathkarthick ravindranath
313
asked Nov 13 '18 at 10:54
karthick ravindranathkarthick ravindranath
313
asked Nov 13 '18 at 10:54
karthick ravindranathkarthick ravindranath
313
313
add a comment |
add a comment |
3 Answers
3
active
oldest
votes
0
According to data you show in your HTML template, this should work :
$scope.getTotal = function()
let total = 0;
$scope.panam.forEach(p =>
total += parseFloat(p.spent);
);
return total;
Iterate all your items (panam), and add spent number to total you send back in your function getTotal.
answered Nov 13 '18 at 10:58
ZoolyZooly
2,75431839
its working. But it just add the values one after the other like 050120143143112201201502905029041. i want the get the total value. @Zooly
– karthick ravindranath
Nov 13 '18 at 11:15
I see, because your values are String. Edited my answer :)
– Zooly
Nov 13 '18 at 11:16
I think answer is not updated. looks same to me. :)
– karthick ravindranath
Nov 13 '18 at 11:19
I've added aparseFloatfunction beforep.spentdata
– Zooly
Nov 13 '18 at 11:19
Yup, My mistake. It works like a charm. Thanks Buddy.
– karthick ravindranath
Nov 13 '18 at 11:21
|
show 1 more comment
0
You can call getTotal and pass the pa
let total =0;
$scope.getTotal = function(obj)
obj.forEach(function(item)
total += parseFloat(item.spent)
)
var pa = $scope.panam;
$scope.getTotal(pa)
answered Nov 13 '18 at 11:00
brkbrk
26.1k31940
add a comment |
0
You can iterate through and add it to the total
$scope.total = 0;
money.then(function(data)
$scope.cash = data;
// if cash is array of object
$scope.getTotal();
);
$scope.getTotal = function()
$scope.cash.forEach((val) =>
$scope.total += val.spent;
)
answered Nov 13 '18 at 11:04
Pramod PatilPramod Patil
2,0101817
add a comment |
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53279431%2fcalculate-the-total-amount-using-angularjs%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
3 Answers
3
active
oldest
votes
3 Answers
3
active
oldest
votes
active
oldest
votes
active
oldest
votes
0
According to data you show in your HTML template, this should work :
$scope.getTotal = function()
let total = 0;
$scope.panam.forEach(p =>
total += parseFloat(p.spent);
);
return total;
Iterate all your items (panam), and add spent number to total you send back in your function getTotal.
answered Nov 13 '18 at 10:58
ZoolyZooly
2,75431839
its working. But it just add the values one after the other like 050120143143112201201502905029041. i want the get the total value. @Zooly
– karthick ravindranath
Nov 13 '18 at 11:15
I see, because your values are String. Edited my answer :)
– Zooly
Nov 13 '18 at 11:16
I think answer is not updated. looks same to me. :)
– karthick ravindranath
Nov 13 '18 at 11:19
I've added aparseFloatfunction beforep.spentdata
– Zooly
Nov 13 '18 at 11:19
Yup, My mistake. It works like a charm. Thanks Buddy.
– karthick ravindranath
Nov 13 '18 at 11:21
|
show 1 more comment
0
According to data you show in your HTML template, this should work :
$scope.getTotal = function()
let total = 0;
$scope.panam.forEach(p =>
total += parseFloat(p.spent);
);
return total;
Iterate all your items (panam), and add spent number to total you send back in your function getTotal.
answered Nov 13 '18 at 10:58
ZoolyZooly
2,75431839
its working. But it just add the values one after the other like 050120143143112201201502905029041. i want the get the total value. @Zooly
– karthick ravindranath
Nov 13 '18 at 11:15
I see, because your values are String. Edited my answer :)
– Zooly
Nov 13 '18 at 11:16
I think answer is not updated. looks same to me. :)
– karthick ravindranath
Nov 13 '18 at 11:19
I've added aparseFloatfunction beforep.spentdata
– Zooly
Nov 13 '18 at 11:19
Yup, My mistake. It works like a charm. Thanks Buddy.
– karthick ravindranath
Nov 13 '18 at 11:21
|
show 1 more comment
0
0
0
According to data you show in your HTML template, this should work :
$scope.getTotal = function()
let total = 0;
$scope.panam.forEach(p =>
total += parseFloat(p.spent);
);
return total;
Iterate all your items (panam), and add spent number to total you send back in your function getTotal.
answered Nov 13 '18 at 10:58
ZoolyZooly
2,75431839
According to data you show in your HTML template, this should work :
$scope.getTotal = function()
let total = 0;
$scope.panam.forEach(p =>
total += parseFloat(p.spent);
);
return total;
Iterate all your items (panam), and add spent number to total you send back in your function getTotal.
answered Nov 13 '18 at 10:58
ZoolyZooly
2,75431839
edited Nov 13 '18 at 11:16
answered Nov 13 '18 at 10:58
ZoolyZooly
2,75431839
answered Nov 13 '18 at 10:58
ZoolyZooly
2,75431839
answered Nov 13 '18 at 10:58
ZoolyZooly
2,75431839
2,75431839
its working. But it just add the values one after the other like 050120143143112201201502905029041. i want the get the total value. @Zooly
– karthick ravindranath
Nov 13 '18 at 11:15
I see, because your values are String. Edited my answer :)
– Zooly
Nov 13 '18 at 11:16
I think answer is not updated. looks same to me. :)
– karthick ravindranath
Nov 13 '18 at 11:19
I've added aparseFloatfunction beforep.spentdata
– Zooly
Nov 13 '18 at 11:19
Yup, My mistake. It works like a charm. Thanks Buddy.
– karthick ravindranath
Nov 13 '18 at 11:21
|
show 1 more comment
its working. But it just add the values one after the other like 050120143143112201201502905029041. i want the get the total value. @Zooly
– karthick ravindranath
Nov 13 '18 at 11:15
I see, because your values are String. Edited my answer :)
– Zooly
Nov 13 '18 at 11:16
I think answer is not updated. looks same to me. :)
– karthick ravindranath
Nov 13 '18 at 11:19
I've added aparseFloatfunction beforep.spentdata
– Zooly
Nov 13 '18 at 11:19
Yup, My mistake. It works like a charm. Thanks Buddy.
– karthick ravindranath
Nov 13 '18 at 11:21
its working. But it just add the values one after the other like 050120143143112201201502905029041. i want the get the total value. @Zooly
– karthick ravindranath
Nov 13 '18 at 11:15
its working. But it just add the values one after the other like 050120143143112201201502905029041. i want the get the total value. @Zooly
– karthick ravindranath
Nov 13 '18 at 11:15
I see, because your values are String. Edited my answer :)
– Zooly
Nov 13 '18 at 11:16
I see, because your values are String. Edited my answer :)
– Zooly
Nov 13 '18 at 11:16
I think answer is not updated. looks same to me. :)
– karthick ravindranath
Nov 13 '18 at 11:19
I think answer is not updated. looks same to me. :)
– karthick ravindranath
Nov 13 '18 at 11:19
I've added a
parseFloat function before p.spent data– Zooly
Nov 13 '18 at 11:19
I've added a
parseFloat function before p.spent data– Zooly
Nov 13 '18 at 11:19
Yup, My mistake. It works like a charm. Thanks Buddy.
– karthick ravindranath
Nov 13 '18 at 11:21
Yup, My mistake. It works like a charm. Thanks Buddy.
– karthick ravindranath
Nov 13 '18 at 11:21
|
show 1 more comment
0
You can call getTotal and pass the pa
let total =0;
$scope.getTotal = function(obj)
obj.forEach(function(item)
total += parseFloat(item.spent)
)
var pa = $scope.panam;
$scope.getTotal(pa)
answered Nov 13 '18 at 11:00
brkbrk
26.1k31940
add a comment |
0
You can call getTotal and pass the pa
let total =0;
$scope.getTotal = function(obj)
obj.forEach(function(item)
total += parseFloat(item.spent)
)
var pa = $scope.panam;
$scope.getTotal(pa)
answered Nov 13 '18 at 11:00
brkbrk
26.1k31940
add a comment |
0
0
0
You can call getTotal and pass the pa
let total =0;
$scope.getTotal = function(obj)
obj.forEach(function(item)
total += parseFloat(item.spent)
)
var pa = $scope.panam;
$scope.getTotal(pa)
answered Nov 13 '18 at 11:00
brkbrk
26.1k31940
You can call getTotal and pass the pa
let total =0;
$scope.getTotal = function(obj)
obj.forEach(function(item)
total += parseFloat(item.spent)
)
var pa = $scope.panam;
$scope.getTotal(pa)
answered Nov 13 '18 at 11:00
brkbrk
26.1k31940
answered Nov 13 '18 at 11:00
brkbrk
26.1k31940
answered Nov 13 '18 at 11:00
brkbrk
26.1k31940
answered Nov 13 '18 at 11:00
brkbrk
26.1k31940
26.1k31940
add a comment |
add a comment |
0
You can iterate through and add it to the total
$scope.total = 0;
money.then(function(data)
$scope.cash = data;
// if cash is array of object
$scope.getTotal();
);
$scope.getTotal = function()
$scope.cash.forEach((val) =>
$scope.total += val.spent;
)
answered Nov 13 '18 at 11:04
Pramod PatilPramod Patil
2,0101817
add a comment |
0
You can iterate through and add it to the total
$scope.total = 0;
money.then(function(data)
$scope.cash = data;
// if cash is array of object
$scope.getTotal();
);
$scope.getTotal = function()
$scope.cash.forEach((val) =>
$scope.total += val.spent;
)
answered Nov 13 '18 at 11:04
Pramod PatilPramod Patil
2,0101817
add a comment |
0
0
0
You can iterate through and add it to the total
$scope.total = 0;
money.then(function(data)
$scope.cash = data;
// if cash is array of object
$scope.getTotal();
);
$scope.getTotal = function()
$scope.cash.forEach((val) =>
$scope.total += val.spent;
)
answered Nov 13 '18 at 11:04
Pramod PatilPramod Patil
2,0101817
You can iterate through and add it to the total
$scope.total = 0;
money.then(function(data)
$scope.cash = data;
// if cash is array of object
$scope.getTotal();
);
$scope.getTotal = function()
$scope.cash.forEach((val) =>
$scope.total += val.spent;
)
answered Nov 13 '18 at 11:04
Pramod PatilPramod Patil
2,0101817
answered Nov 13 '18 at 11:04
Pramod PatilPramod Patil
2,0101817
answered Nov 13 '18 at 11:04
Pramod PatilPramod Patil
2,0101817
answered Nov 13 '18 at 11:04
Pramod PatilPramod Patil
2,0101817
2,0101817
add a comment |
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53279431%2fcalculate-the-total-amount-using-angularjs%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
