Edit property of an object in array of objects - javascript

I have a class itemCollection that stores information about purchases. This class has array _items as property where purchases are stores. When user adds new purchase in cart this class using addItem method that adds that item in _items property if its already has this item this method iterates quantity property if not adds new item in array.
Problem is that instead of adding new item in array when other item is chosen its keeps incrementing quantity property of a first item that was added.
cartCollection class (object):
var cartCollection = {
_items: [],
addItem: function(obj) {
'use strict';
var purchase = {
item: {
id: obj.id,
name: obj.name,
price: obj.price
},
thisItemTotal: obj.price,
quantity: 1
};
var result = _.findWhere(this._items, purchase.item.id);
console.log(result);
if (typeof result != 'undefined') {
//console.log(result);
var index = _.findIndex(this._items, {
id: result.item.id
});
//console.log(index);
result.quantity++;
this._items[index] = result;
this._itemTotalPrice();
} else if (typeof result === 'undefined') {
console.log("Im was called!");
this._items.push(purchase);
console.log(this._items);
}
},
...

Since purchase doesn't have an ID, but has an "item" with an ID, The correct find statement should be:
var result = _.find(this._items, function(item) {
return item.item.id == purchase.item.id;
});
It might be better to rename _items to _purchases in order to disambiguate
The complete code should be something like:
addItem: function(obj) {
'use strict';
var purchase = {
item: _.pick(obj, 'id', 'name', 'price')
thisItemTotal: obj.price,
quantity: 1
};
var result = _.find(this._items, function(item) {
return item.item.id == purchase.item.id;
});
console.log(result);
if (result) {
result.quantity++;
this._itemTotalPrice();
}
else {
console.log("Im was called!");
this._items.push(purchase);
console.log(this._items);
}
},

Your findWhere statement is broken. It should be:
var result = _.findWhere(this._items, {id:purchase.item.id});
Good luck

Related

underscore js map array with optional object parameters

I've got following code:
setStatus = false;
_.map(array, function (element) {
return {
name: element.type,
status: element.status
})
I'd like to optionally set 'status' parameter. F.e when setStatus variable is false then elements in mapped collection would be containing 'name' parameter only;
How can I handle this?
Just add a simple condition.
var setStatus = false;
_.map(array, function (element) {
if (setStatus) {
return {
name: element.type,
status: element.status
}
} else {
return {
name: element.type
}
}
});
try this
var setStatus = false;
_.map(array, function (element) {
var obj = {name: element.type};
if(setStatus) obj.status = element.status;
return obj;
})

How can i append table data value in ng-repeat using angularjs

I have two table. dynamicaly data will come for table one after I click the dynamic table data button. after I click the done button I want to
append the data in $scope.notiData.
now after I click done button $scope.notiData data is gone. every time data is coming from tableTwo what is there in presently. so how can i use concat Iin $scope.notiData.please help.
http://jsfiddle.net/A6bt3/127/
Js
var app = angular.module('myApp', []);
function checkBoxCtrl($scope) {
$scope.notiData = [];
$scope.tableOne = [{
firstname: 'robert',
value: 'a'
}, {
firstname: 'raman',
value: 'b'
}, {
firstname: 'kavi',
value: 'c'
}, {
firstname: 'rorank',
value: 'd'
}
];
$scope.tableOne1 = [{
firstname: 'robvzxcvert',
value: 'a'
}, {
firstname: 'ramsdgan',
value: 'b'
}, {
firstname: 'kasdgsdgvi',
value: 'c'
}, {
firstname: 'rordggank',
value: 'd'
}
];
$scope.tableTwo = [];//the table to be submitted
function removeitems(tableRef) { //revmove items from tableRef
var i;
for (i = tableRef.length - 1; i >= 0; i -= 1) {
if (tableRef[i].checked) {
tableRef.splice(i, 1);
}
}
}
$scope.btnRight = function () {
//Loop through tableone
$scope.tableOne.forEach(function (item, i) {
// if item is checked add to tabletwo
if (item.checked) {
$scope.tableTwo.push(item);
}
})
removeitems($scope.tableOne);
}
$scope.btnAllRight = function () {
$scope.tableOne.forEach(function (item, i) {
item.checked = true;
$scope.tableTwo.push(item);
})
removeitems($scope.tableOne);
}
$scope.btnLeft = function () {
$scope.tableTwo.forEach(function (item, i) {
if (item.checked) {
$scope.tableOne.push(item);
}
})
removeitems($scope.tableTwo);
}
$scope.btnAllLeft = function () {
$scope.tableTwo.forEach(function (item, i) {
item.checked = true;
$scope.tableOne.push(item);
})
removeitems($scope.tableTwo);
}
$scope.done = function () {
angular.extend($scope.notiData, $scope.tableTwo);
$scope.tableTwo = [];
}
$scope.removeRow = function (item) {
var index = $scope.notiData.indexOf(item);
$scope.notiData.splice(index, 1);
}
$scope.dynamicTable= function () {
$scope.tableOne1.forEach(function (item, i) {
item.checked = true;
$scope.tableOne.push(item);
})
}
};
I want to append the data in $scope.notiData. now after I click done button $scope.notiData data is gone
The angular.extend replaces existing entries. To append, use array.concat:
$scope.done = function () {
//angular.extend($scope.notiData, $scope.tableTwo);
$scope.notiData = $scope.notiData.concat($scope.tableTwo);
$scope.tableTwo = [];
}
Also to avoid duplicate in ng-repeat use track by errors, use angular.copy to push items:
$scope.dynamicTable= function () {
$scope.tableOne1.forEach(function (item, i) {
item.checked = true;
//$scope.tableOne.push(item);
$scope.tableOne.push(angular.copy(item));
});
};
The ng-repeat directive tracks array objects by reference. Pushing duplicate objects will result in tracking errors. The angular.copy will create a new unique object reference for the item and will avoid the tracking errors.
The DEMO on JSFiddle.

Find duplicate object from one collection to another collection - using 2 arrays in knockout JS

In knockout JS I want to find out 1st duplicate object from my collection and return that object as modal. I have to check for 1st duplicate object from first array aginst 2nd Array based on my condition. Tried _findWhere & _.Some & _.each nothing worked. Can someone help
Here -- MyMainModal is my Moda which will have multiple objects
self.dupRecord= function (MyMainModal) {
var Modaldata= ko.mapping.toJS(MyMainModal);
return _.some(Modaldata, function (MD1) {
return _.some(Modaldata, function (MD2) {
if ((MD1.ID!== MD2.Id) &&
(MD1.Name === MD2.name));
});
});
};
How about incorporating the check for first duplicate into the mapping? Something like:
function Child(data) {
ko.mapping.fromJS(data, {}, this);
};
var model = {
children: [{
id: '1',
name: 'Billy'
}, {
id: '2',
name: 'Susy'
}]
};
var mapping = {
children: {
key: function(data) {
return ko.utils.unwrapObservable(data.id);
},
create: function(options) {
console.log('creating ' + options.data.name, options.parent);
var newChild = new Child(options.data);
if(options.parent.firstDuplicate() === undefined)
options.parent.children().forEach(function(child) {
if(child.name() === newChild.name())
options.parent.firstDuplicate([child, newChild]);
});
return newChild;
},
update: function(options) {
console.log(' updating ' + options.data.name);
return options.target;
}
}
};
var vm = {
children: ko.observableArray(),
firstDuplicate: ko.observable()
};
ko.mapping.fromJS(model, mapping, vm);
ko.applyBindings(vm);
model.children.push({
id: 3,
name: 'Billy'
});
setTimeout(function() {
console.log('--remapping--');
ko.mapping.fromJS(model, mapping, vm);
}, 2000);
I read that as, "if we're not updating the record, potentially set the first duplicate." Here's a fiddle: http://jsfiddle.net/ge1abt6a/

node creating instances via costructors

While experimenting with nodejs I encountered a problem of enabling isntances creation via Constructors. I create simple cart basket functionality.
I got file cart.js
var items = [];
function addItem (name, price) {
items.push({
name: name,
price: price
});
}
exports.total = function () {
return items.reduce(function (a,b) {
return a + b.price;
}, 0);
};
exports.addItem = addItem;
I run it with node
var cart = require('./cart')
But what if I need to create multiple instances of a Cart?
I tried to refactor my code, creating a Constructor, that holds items[] addItem() and total() functions, like this:
exports.Cart = function () {
var items = [];
function addItem (name, price) {
items.push({
name: name,
price: price
});
}
function total () {
return items.reduce(function (a,b) {
return a + b.price;
}, 0);
}
};
I run it like this:
var cart = require('./cart');
cart.addItem('Pepsi',199); // no problem with this
cart2 = new cart.Cart(); // it gives me undefined can't be a function
I understand, that I can use PROTOTYPE property to add functions and props to my Cart
So I create a second file cart2.js and place something like:
function Cart () {
this.items = [];
}
Cart.prototype.addItem = function (name, price) {
this.items.push({
name: name,
price: price
});
};
Cart.prototype.total = function () {
return this.items.reduce(function (a,b) {
return a + b.price;
}, 0);
};
module.exports = Cart;
And now it works.
But in order to explore all possiblities, I want to know how I can solve it the first way I tried. When I can use it as "instanceble" Class thing and as singleton thing, with only one instance, at the same time.
Can you please advice me how to solve it the way I wanted in the first place?
I'll appreciate if you provide some other ways to solve this task of creating instanceable Classes.
The first option might look like this:
exports.Cart = function () {
var items = [];
// ...other private stuff...
return {
addItem: function (name, price) {
items.push({
name: name,
price: price
});
},
total: function() {
return items.reduce(function (a,b) {
return a + b.price;
}, 0);
}
// ...other public stuff...
}
};
Usage:
var carts = require('carts');
firstCart = carts.Cart();
second = carts.Cart();

Angular - Only push to array if unique

I have an Angular application that collects values of items for an invoice, I want to make sure only unique items are being added to this collection but am having no luck.
I am pushing 3 pieces of information to this collection: id, price, and type. I want to make sure there is nothing in the collection currently matching those 3 points.
// My container
$scope.invoice = {
items: [{
}]
}
$scope.addPhoto = function() {
console.log('Withdrawing Photo: '+ $scope.item.id);
if ($scope.invoice.items.indexOf(item.id) != $scope.item.id)
{
$scope.invoice.items.push({
id: $scope.item.id,
price: $scope.item.price,
type: 'photo'
});
}
}
// Trying to avoid collections like this
invoice: {
items:
[ { } , {
id: 25
price: 0
type: photo
} , {
id: 25
price: 0
type: photo
} ]
}
.filter is pretty much what you need.
$scope.addPhoto = function() {
console.log('Withdrawing Photo: '+ $scope.item.id);
var matches = $scope.invoice.items.filter(function(datum) {
return datum.id === $scope.item.id &&
datum.price === $scope.item.price &&
datum.type === $scope.item.type;
});
if (!matches.length)
{
$scope.invoice.items.push({
id: $scope.item.id,
price: $scope.item.price,
type: 'photo'
});
}
}
Semi-contrived JSFiddle
This is the solution I came up with to solve my problem, hopefully it helps someone else.
$scope.addPhoto = function () {
console.log('Withdrawing Photo: ' + $scope.item.id);
var newItemId = $scope.item.id;
var newItemPrice = $scope.item.price;
var newItemType = 'photo';
var matches = true;
// Make sure user hasnt already added this item
angular.forEach($scope.invoice.items, function(item) {
if (newItemId === item.id && newItemPrice === item.price && newItemType === item.type) {
matches = false;
$scope.message = 'You have already selected to withdraw this item!';
}
});
// add item to collection
if (matches != false) {
$scope.invoice.items.push({
id: $scope.item.id,
price: $scope.item.price,
type: 'photo'
});
$scope.total += $scope.item.price;
$scope.message = 'Total Amount Selected';
}
};
YOu can simple pop opposite of push
array.splice(array.pop(item));

Categories