"scrollX": true option breaking other options

BenRacicot

I have a table working fantastic with DataTables. However I need the table to be able to scroll horizontally. Here is my setup working:

$('table').dataTable({ 
    // "scrollX": true,
    "searching": true,
    "ordering": true,
    "pagingType": "full_numbers",
    "info": true,
    "dom": '<"top"fl<"clear">>rt<"bottom"lp<"clear">>'
});

This instantiation with "scrollX": true allows a beautiful horizontal scroll but breaks pagination, displays all entries on one page and ignores the added styles/classes. Also the console reads: Uncaught TypeError: Cannot read property 'style' of undefined

$('table').dataTable({ 
    "scrollX": true,
    "searching": true,
    "ordering": true,
    "pagingType": "full_numbers",
        "info": true,
    "dom": '<"top"fl<"clear">>rt<"bottom"lp<"clear">>'
});

Any advice on how to get "scrollX": true working correctly would be great. Here is the most raw example I can make outside of my local env: http://jsfiddle.net/nde27cfx/
Thanks in advance.

allan

Your HTML is not valid. You have:

<table class="cell-border nowrap order-column hover stripe">
    <tbody>
        <thead>
            <tr>

There is an example in the manual that shows the structure you need to use to create a valid HTML table.

Allan