Knockoutjs custom binding are executed before items are fully rendered

Question

I\'m trying to execute callback on list of items to make pagination using DataTable. Now i want to execute my callback after all my items have been rendered not after each item

Answer 1

From a logical point of view, shouldn't the ConvertToDataTable binding be on the table itself, instead on the foreach?

Also, shouldn't you control table layout via the binding or the view model? The custom binding is a very bad place for hard-coded values.

Anyway, controlsDescendantBindings is your friend (docs):

Custom Binding:

ko.bindingHandlers.dataTable = {
    init: function () {
        return { controlsDescendantBindings: true };
    },
    update: function (element, valueAccessor, allBindings, viewModel, bindingContext) {
        var layout = valueAccessor();

        ko.applyBindingsToDescendants(bindingContext, element);
        $(element).dataTable({ "sDom": layout });
    }
};

View Model:

{
    dataTableLayout: "<'row'<'span6'l><'span6'f>r>t<'row'<'span6'i><'span6'p>>",
    tasks: ko.observableArray([/* ... */])
}

Template:

    

        

            
Task Name
            
Task Description
        
    
    

        

            

            

        
    

http://jsfiddle.net/WcaM5/

Disclaimer: I don't know exactly how jQuery DataTables work, so the sample is aircode. The point I want to make is that you can take manual control over the binding if necessary.