function AppViewModel() {
self.tagbuttons=ko.observableArray([
{shotbar:false, frozendrinks: false, livemusic: false, patio:false, food:false}
]);
self.toggleTag = function(data,event) {
var id = event.target.id;
self.tagbuttons()[0][id] = !self.tagbuttons()[0][id];
console.log(self.tagbuttons()[0][id]);
if(self.tagbuttons()[0][id] == true)
{
$(event.target).closest('li').addClass("active");
console.log(event.target.id+":"+"active");
}
else
{
$(event.target).closest('li').removeClass("active");
console.log(event.target.id+":"+"inactive");}
}
}
ko.applyBindings(new AppViewModel());
The output of my console.log(self.tagbuttons()[0][id]) correctly displays the boolean value, but the value does not update in my array. Here is the HTML code:
<div data-bind="text: tagbuttons()[0].shotbar"></di>