jQuery DataTables using filtered Ember Data - Column widths don't resize

Little background information first:

I have an Ember component that uses a Handlebars to populate a tbody element with a bunch of rows that contain all the data in the results.

Above this table, there is a toggle that sets whether the table should show all the entries or only the ones that have isEnabled set to true. This toggle sets the viewAll component property. When the toggle is flipped, the data changes correctly but the columns in the Datatable extend off the page (as seen below).

I've tried setting and observer on the viewAll property so that every time it was changed I called draw(). I've tried calling resultsTable.columns.adjust().draw(), but to to avail.

Anyone have any idea, what's going on?

For reference the environment uses Bootstrap 3, Ember 2.6.0, Datatables 1.10.12, and jQuery 2.2.4.

Here is the template (the table exists inside a Bootstrap panel-body):

<tbody>
    
        <!--Ember truth-helpers used here-->
        
            <tr data-id=>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
            </tr>
        
    
</tbody>

Here is the component code:

Ember.run.scheduleOnce('afterRender', this, function() {
    resultsTable = this.$("#tbl_results").DataTable(
        {   
            "responsive":true,
            "autoWidth": true,
            "select": true
        }
    );
});

And the screenshot: Screenshot showing row overflow

Any advice is much appreciated. Thanks!