How to automatically update the grandtotal when quantity is changed
<p>I'm using knockout for my shopping cart and i cant seem to get the grand total to automatically update based on the change of an items.</p>

<p><strong>VIEW</strong></p>

<pre><code>&lt;div data-bind="foreach: cartItems"&gt;
 &lt;div class="row item-row"&gt;
  &lt;h3 data-bind="text: fullname"&gt;&lt;/h3&gt;
  &lt;p data-bind="text: sku"&gt;&lt;/p&gt;
  &lt;select data-bind="quantityDropdown: number, event: {change: $parent.updateqty}"&gt;&lt;/select&gt;
 &lt;/div&gt;
&lt;/div&gt;

&lt;div class="row"&gt;
    &lt;p class="checkout-box-totals"&gt;Subtotal:&lt;/p&gt;
    &lt;p class="checkout-box-price"&gt;
        &lt;span class="glyphicon glyphicon-usd" data-bind="text: subtotal()"&gt;&lt;/span&gt;
    &lt;/p&gt;
&lt;/div&gt;

&lt;hr/&gt;
&lt;div class="row checkout-box-total"&gt;
    &lt;p class="checkout-box-totals"&gt;Total:&lt;/p&gt;
    &lt;p class="checkout-box-price"&gt;
        &lt;span class="glyphicon glyphicon-usd" data-bind="text: grandTotal()"&gt;&lt;/span&gt;
    &lt;/p&gt;

&lt;/div&gt;
</code></pre>

<p><strong>VIEWMODEL</strong></p>

<pre><code>    //This items placed in cart is placed in my cookiearray
    //cookiearray contains = datetime, id, typeid, qty, fullname, image, price, sku, weight)
    var cookiestring = $.cookie("cookieCart");
    var arrayfromJson = JSON.parse(cookiestring);

    //Deletes the cookie
    var deleteCookie = function (name) {
      document.cookie = name + "=;expires=Thu, 01 Jan 1970 00:00:01 GMT;";
    };

    function UpdateCookieQty(id, typeid, select) {
       for (var i = arrayfromJson.length - 1; i &gt;= 0; i--) {
           if (arrayfromJson[i].id === id &amp;&amp; arrayfromJson[i].typeid === typeid) {
               arrayfromJson[i].qty = select;
           }
       }
       //recreates the cookie string after updating the quantity. This new quantity isnt read in the observable until browser is refreshed.
       deleteCookie("cookieCart");
       $.cookie("cookieCart", JSON.stringify(arrayfromJson), { path: "/" });
   }



function AppViewModel() {
    var self = this;
    self.cartItems = ko.observableArray(arrayfromJson);
    self.quantity = ko.observable(); //here im trying to make the quantity observable.
    var totalShipWeight = 0;

    //calculating total weight of the cart
    for (var n = 0; n &lt; self.cartItems().length; n++) {
        var itemweight = parseFloat(arrayfromJson[n].weight, 10);
        var shipqty = parseFloat(arrayfromJson[n].qty, 10);
        totalShipWeight += itemweight * shipqty;
    }

    //calculating the subtotal doesn't update when quantity is changed :(
    self.subtotal = ko.computed(function () {
        var total = 0;
        for (var i = 0; i &lt; self.cartItems().length; i++) {
            var itemPrice = parseFloat(arrayfromJson[i].price, 10);
            var itemqty = parseFloat(arrayfromJson[i].qty, 10);
            total += itemPrice * itemqty;
        }
        return total;
    });

    //calculating tax if tax applies, doesn't update when quantity is changed
    self.taxedItems = ko.pureComputed(function () {
        var taxcost = 0;
        var total = 0;
        if (totalShipWeight &gt; 0) {
            for (var i = 0; i &lt; self.cartItems().length; i++) {
                var itemPrice = parseFloat(arrayfromJson[i].price, 10);
                var itemqty = parseFloat(arrayfromJson[i].qty, 10);
                total += itemPrice * itemqty;
            }
            taxcost = parseFloat((total * tax).toFixed(2));
        } 
        return taxcost;
    });

    //calculating tax if tax applies, doesn't update when quantity is changed
    self.grandTotal = ko.pureComputed(function () {
        var total = 0;
        var grandTotal = 0;
        for (var i = 0; i &lt; self.cartItems().length; i++) {
            var itemPrice = parseFloat(arrayfromJson[i].price, 10);
            var itemqty = parseInt(arrayfromJson[i].qty, 10);
            total += itemPrice * itemqty;
        }
        grandTotal = total + (total * tax);
        //Add shipping cost
        return grandTotal;
    });

    //number = 50 from controller. this is just to display dropdown for max amount of quantity
    ko.bindingHandlers.quantityDropdown = {
        update: function (element) {
            for (var i = 1; i &lt; number + 1; i++) {
                var selectedQty = "";

                for (var x = 0; x &lt; self.cartItems().length; x++) {
                    var itemqty = parseFloat(arrayfromJson[x].qty, 10);

                    if (i === itemqty) {
                        selectedQty = " selected='selected'";
                    }
                }
                // Add each option element to the select here
                $(element).append("&lt;option value='" + i + "' " + selectedQty + "&gt;" + i + "&lt;/option&gt;");
            }
        }
    };


    //this is where the user updates quantity. I goes to the function, 
    //updates quantity for particular item (but for some reason updates both items).
    //then the change is supposed to reflect in the subtotal and grandtotal, but doesnt.
    self.updateqty = function (viewModel, event) {

        UpdateCookieQty(this.id, this.typeid, event.target.value);
        }
    }

    ko.applyBindings(new AppViewModel());
</code></pre>

<p>Im fairly new to knockout but is there something wrong here?</p>