javascript - Knockout: custom binding update not firing on computed field -


i'm trying render cart table using knockout.

i've cart entity , cartitem entity:

var cartitem = function(product, qty){     var self = this;     self.product = ko.observable(product);     self.qty = ko.observable(qty);     self.title = ko.computed(...);     self.unitprice = ko.computed(function(){         return self.product().price();     });     self.price = ko.computed(function(){         return self.unitprice()*self.qty();     }); }  var cart = function(){     var self = this;     self.items = ko.observablearray([]);     self.total = ko.computed(function(){         var total = 0;         ko.utils.arrayforeach(ko.utils.arraymap(self.items(), function(i){ return i.price() }), function(price){             total += price;         });         return total;     }); } 

and html:

<table class="table">   <thead>     <tr>         <th>product</th>         <th>price</th>         <th>qty</th>         <th>total</th>     </tr>   </thead>   <tfoot>     <tr>       <td colspan="3">total:</td>       <td data-bind="price: cart.total"></td>     </tr>   </tfoot>   <tbody data-bind="foreach: cart.items">     <tr>       <td data-bind="text: title"></td>       <td data-bind="price: unitprice"></td>       <td data-bind="text: qty"></td>       <td data-bind="price: price"></td>     </tr>   </tbody> </table> 

as can see, i've create 'price' binding render price, code:

ko.bindinghandlers.price = {     init :  ko.bindinghandlers.text.init,     update: function(element, valueaccessor, allbindings, data, context) {         var value = ko.unwrap(valueaccessor());         var text =  '€ ' + value.tofixed(2).replace(/(\d)(?=(\d{3})+\.)/g, "$1 ");         ko.bindinghandlers.text.update(element, function(){ return text; }, allbindings, data, context);     } }; 

the custom binding 'price' works cart items not cart.total, nothing rendered.

i've inserted console.log(element) in price binding , cart items printed when cart updated , can't figure out why.

using instead 'text: cart.total' works.

the js custom binding included after start of knockout application.

i've included custom binding before , works.


Comments

Popular posts from this blog

javascript - Jquery show_hide, what to add in order to make the page scroll to the bottom of the hidden field once button is clicked -

javascript - Highcharts multi-color line -

javascript - Enter key does not work in search box -