0

I have used DataTables in several web2py apps with little trouble (after the learning curve), but I am working on a new app and cannot seem to get the columnDefs to set the column widths. Here is the javascript in the page's HTML:

<script type="text/javascript" charset="utf-8">
$(document).ready(function() {
    $('#list').dataTable( {
        searching: true,
        displayLength: 10,
        lengthChange: false,
        paging: true,
        columnDefs: [ 
            {"width": "15%", "targets": 0 },
            {"width": "15%", "targets": 1 },
            {"width": "10%", "targets": 2 },
            {"width":  "5%", "targets": 3 },
            {"width": "10%", "targets": 4 },
            {"width": "10%", "targets": 5 },
            {"width":  "5%", "targets": 6 },
            {"width":  "5%", "targets": 7 },
            {"width": "20%", "targets": 8 }
        ]
    });
});

All the other options (searching, displayLength, etc.) work as advertised, so I know the function is working, but I've tried about a hundred different things to make the column widths change, to no avail. I get the same lack of response using the columns option, or going back to the legacy aoColumnDefs. There are exactly 9 TH elements and 9 TD elements, so I know there's no mismatch there and there is, in fact, a table with an id='list'. Using Datatables 1.10.11.

Sorry for this seemingly elemental problem; I will appreciate any help or insights as to what I'm doing wrong here.

johnz
  • 489
  • 2
  • 17
  • What styles do you have on the table itself? I've found that if you make the table "responsive" that the column width setting often doesn't work because the table tries to fill in the entire width of the screen and seems to "override" the manual settings of column length. – jonmrich Feb 23 '16 at 15:51
  • Thanks for the response. The only styles on the table are those set by the CSS provided by jQuery and Datatables; I don't add or modify those at all. – johnz Feb 23 '16 at 17:23

0 Answers0