Observable update not reflecting in the UI in knockout

Question

I have the below HTML

<table style="margin: 0 auto; color: grey; empty-cells: show">
    <tbody data-bind="foreach: perEntityPartnerPrices">
        <tr data-bind="css: { even: $parentContext.$index() % 2 }">
            <td class="input-with-revert-button">
                <input data-bind="numericValue: centralServiceFee,enable:false" class="integer" />
                <button class="ui-button ui-corner-all ui-widget" data-bind="enable: false, css: { 'ui-state-disabled': (!centralServiceFeeReturnEnable()) }, attr: { 'title': centralServiceReturnText }, click: resetCentralServiceFee">
                    <span class="ui-icon ui-icon-arrowreturnthick-1-w"></span>
                </button>
            </td>
        </tr>      
    </tbody>
</table>

So Basically I am binding to an array perEntityPartnerPrices and using the centralServiceFee property.

this.centralServiceFee = ko.observable();

I am updating the value of the centralServiceFee as shown below

for (var i = 0; i < parentPartnerPricingVM.perEntityPartnerPrices.length; i++) {
                if (i >= 1) {
                    parentPartnerPricingVM.perEntityPartnerPrices[i].centralServiceFee._latestValue =                      7;
                }
            }

I see the value being updated as I have a calculated value which I see is updated but in the UI it still shows the old value. Can someone please tell me what I am doing wrong here.

Edit : Just a note I am updating the latestvalue directly as I have a subscribe function on the centralServiceFee and if I change one value which changes others then the subscribe keeps on firing.

Thanks

Why aren't you updating it like this centralServiceFee(7)? — adiga
Because based on a property value update in the first array index I have to update the same property value in other indexes and I have a subscribe function on the property..so the subscribe method keeps on firing. — SP1

Akrion Akrion · Accepted Answer · 2019-05-17T19:39:42

centralServiceFee is an observable so you should update it like so:

parentPartnerPricingVM.perEntityPartnerPrices[i].centralServiceFee(7)

Observable update not reflecting in the UI in knockout

1 Answers