2012-05-30 2 views
0

Хорошо. Я нахожу проблему при загрузке данных в таблицу, которая находится в скрытом элементе на моей странице. У меня есть несколько страниц с вкладкой «Tab», где единственной видимой в то время является активная вкладка, а все остальные вкладки в момент времени til активированы: display:none. Когда я вручную вызываю вкладку в качестве основной вкладки, нет никакой проблемы с таблицей или ее столбцами. Его только тогда, когда вкладки изначально скрыты, проблема с начальным отображением таблицы является проблемой.jQuery JavaScript столбцы Datatables конденсируют/сжимают вместе

Я говорю о начальном отображении, потому что, когда я нажимаю на заголовок столбца, чтобы отсортировать данный столбец, таблица, похоже, исправляет себя, и столбцы больше не сжимаются/конденсируются вместе.

Это мой текущий код DataTable

$('#'+tableID).dataTable(
{ 
    "sPaginationType": "full_numbers", 
    "bPaginate": false, 
    "bFilter": false, 
    "bAutoWidth": true, 
    "sScrollY": tableY+"px", 
    "bScrollCollapse": true, 
    "oLanguage": { 
     "sInfo": "Showing _END_ Events." 
    }, 
    "aaSorting": [[ 1, "asc" ]], 
    "aoColumns": [ 
     null, 
     null 
     ] 
}); 

и я попытался задать ширину столбцов, как:

"aoColumns": [ 
     { "sWidth": "80%" }, 
     { "sWidth": "20%" } 
     ] 

который также не работает. Поэтому я застрял в данный момент, пытаясь решить эту проблему, но не совсем уверен, где и как начать.

Кроме того, для ради аргумента позволяет сказать, что моя таблица структура напоминает ..

<table> 
    <thead> 
    <tr><td></td><td></td></tr> 
    </thead> 
    <tfoot> 
    <tr><td></td><td></td></tr> 
    </tfoot> 
    <tbody> 
    <tr><td></td><td></td></tr> 
    <tr><td></td><td></td></tr> 
    <tr><td></td><td></td></tr> 
    </tbody> 
</table> 
+0

Вы исследовали любой из ответов на этот вопрос: http://stackoverflow.com/questions/604933/jquery-datatables-table-width-problem? В принятом ответе была указана соответствующая ссылка на данные: http://datatables.net/examples/api/tabs_and_scrolling.html – mg1075

+0

После гораздо большего поиска до и после этого сообщения. Я закончил выяснять решение. Я знал, что это связано с тем, что элемент был скрыт, и как это было, поскольку браузеры не учитывают ширину/высоту и т. Д. На элементе с дисплеем: none. Конечно, как работает система, с которой я работаю, она сделала оценку проблемы немного сложнее, чем следовало бы, но в конце она была привязана к jquery ui и привязке к событию «tabs» вне нормального метода, приведенного в примеры я нашел еще где. – chris

ответ

0

Я в конечном итоге решать свою собственную проблему с помощью моих поисков, и на основе от пример, приведенный на API документы, связанные с DataTables/jquery ui.

Моим решением было привязать к событию вкладки jquery ui, а затем отключить мою функцию, чтобы построить таблицу, в которой мне нужна база, на какой вкладке была выбрана.

$(document).ready(function() { 
    $("#storage").bind('tabsselect', function(event, ui) 
    { 
     if (ui.index === 1) 
     { 
      tables.statistics("metrics", "metric"); 
     } 
    }); 
}); 
Смежные вопросы