使jQuery Datatable適合內容區域

Question

我想第一次使用jQuery Datatables。我從Web服務獲取數據，然後按照Datatables預期的格式（Javascript數據和一列數據）進行處理。我的問題是，我正在試圖將它放置在儀表板上，以便容器很小，我需要數據表來適應高度和寬度。

<div class="column"> 
<div class="portlet" style="border:2px solid;"> 
    <div class="portlet-header">Table</div> 
    <div class="portlet-content" id="b_container"></div> 
</div> 

var createNewTable = function (data) { 

var aoColumn = _.map(_.first(data), function (row) { 
    return { 
     'sTitle': row.Key 
    }; 
}); 
var aaData = _.map(data, function (row) { 
    return _.map(row, function (innerRow) { 
     return innerRow.Value; 
    }); 
}); 
$('.portlet-content').append('<table id ="t_container"><thead></thead><tbody></tbody></table>'); 
$('#t_container').dataTable({ 
    "bAutoWidth": false, 
     "aaData": aaData, 
     "aoColumns": aoColumn 
}); 

};

完整的代碼示例可以看出在這個小提琴：

http://jsfiddle.net/2ccgk/3/

Answer 1

我沒有足夠的代表處發表評論，但底線是，你將不得不樣式表中，以適應。減少字體，填充等，並設置每個列的寬度，直到它適合容器。在這樣一個小容器中有很多列，這不會是一件容易的事情。