explicit column width not being respected.

explicit column width not being respected.

NicklepeddeNicklepedde Posts: 6Questions: 0Answers: 0
edited June 2012 in Bug reports
Here is my JS:
[code]
jQuery('#hotstock .datagrid').dataTable({

"aoColumns": [
{ "sWidth": "65px" },
{ "sWidth": "284px" },
{ "sWidth": "105px" },
{ "sWidth": "57px" }
]
} );
[/code]

it's an HTML table, and when rendering it dose not apply the widths to the columns.

Table looks like this:
[code]




RankNamePriceBuy





1
Apple Inc.
$555.50
Buy



2
Google Inc.
$574.69
Buy



3
Walt Disney
$44.24
Buy



4
Yahoo! Inc.
$14.83
Buy



5
SPDR Gold Trust
$157.13
Buy



6
Microsoft Corporation
$28.37
Buy



7
ProShares UltraPro S..
$58.77
Buy



8
Young Innovations Inc.
$32.68
Buy



9
iShares Silver Trust ETF
$27.44
Buy



10
The Goldman Sachs Gr..
$91.02
Buy





10
The Goldman Sachs Gr..
$91.02
Buy




[/code]

Replies

  • NicklepeddeNicklepedde Posts: 6Questions: 0Answers: 0
    I've also tried adding this for the heck of it:

    [code]
    RankNamePriceBuy
    [/code]

    no luck. And I realized I forgot to mention this table is on an unfocused tab. (Though I wouldn't think that shoudl matter when I passing the widths explicitly.)
  • allanallan Posts: 63,381Questions: 1Answers: 10,449 Site admin
    If you want absolute pixel control add:

    [code]
    table.dataTable { table-layout: fixed; }
    [/code]

    to your CSS - the browser will adhere to your values. However, if DataTables isn't using your values, there will be a reason for it, somewhere in its column width calculations - usually the content being to big for the widths given.

    If you could give us a link that would be useful to determine what is happening.

    Allan
  • NicklepeddeNicklepedde Posts: 6Questions: 0Answers: 0
    I'm very positive those are correct, as I used bAutoWidth :true to find out what the values shoudl be, and to be clear it's not the browser or CSS, but the datatables that seems to be dropping the ball, because despite the HTML used above when it gets drawn the generated content looks like this:

    [code]

    Rank
    Name
    Price
    Buy

    [/code]

    Unfortunately I don't have a link, that's publicly viewable. Though for more insight, I'm trying to get this grid, and a few Ajax powered ones to not "flicker" on tab change. I started using "fnAdjustColumnSizing", but on first load it would wait for the AJAX data before adjusting the size (despite being pre-popuated "iDeferLoading": 20), and that would cause just enough delay to put my client off on the half second on bunched up headers.
This discussion has been closed.