Question

I am trying to use DataTables with a knockout-generated table.

The problem is illustrated here: http://jsfiddle.net/sQrNu/

In my table I have a number of fixed column headers, plus a number of column headers that
come from the view model. This works fine with a standard HTML table in knockout.

However when the dataTable widget is applied to the table, the dynamic columns get turned into a simple column with the text “[object Object]”. It seems that after dataTables gets
applied the templating breaks. If I replace the template:

data-bind=”text: $data”

With:

data-bind=”text: JSON.stringify($data)”

Then I find that suddenly $data now erroneously refers to my root view model; the “foreach: headers” is no longer working.

Is this a bug in Knockout?

Answer 1

Add a setTimeout to let the DOM finish updating before you try to attach the dataTable.

http://jsfiddle.net/jearles/sQrNu/1/