There's a beforeRemove, afterAdd but what about an afterUpdate?

https://groups.google.com/d/topic/knockoutjs/_ydXauy-PaA/discussion

by gurkavcu

HTML

<script src="https://github.com/jquery/jquery-tmpl/raw/master/jquery.tmpl.js"></script>
<script src="https://github.com/SteveSanderson/knockout/raw/master/build/output/knockout-latest.debug.js"></script>
<div data-bind='template: { name: "list_item_template", foreach: listItemsToShow}'> </div>   

<script id="list_item_template" type="text/html">
    <div class="listItem clearfix" id="list_item_${id}" data-bind="highlight: $data">
        <div class="checkWrap"> 
            <input type="checkbox" class="list_completed_checkbox" id="list_item_completed_checkbox_${id}" data-bind="checked: completed">
        </div>
        <input class="list_item_title" name="list_item[title]" type="text" data-bind="value: title, valueUpdate: 'afterkeydown'">
    </div>
</script>

JavaScript

ko.bindingHandlers.highlight = {
    update: function(element, valueAccessor) {
        ko.toJS(valueAccessor()); //unwrap all observables in the object passed, to create dependencies on each observable (title and completed in this case)
        
        //we don't want to do this the first time the binding runs
        if ($(element).data("ko_init")) {
            $(element).effect('highlight', {color: '#8DD2F7'}, 700);
        } 
        else {
            $(element).data("ko_init", true);     
        }     
    }
};

function Item(id, title, completed) {
    return {
        id: id,
        title: ko.observable(title),
        completed: ko.observable(completed)
    };
}

var mymodel = {
    listItemsToShow: ko.observableArray([
        new Item(1, "One", false),
        new Item(2, "Two", false),
        new Item(3, "Three", false)
        ])
};

ko.applyBindings(mymodel);