Jquery DataTable: заголовки таблиц появляются дважды - PullRequest
Новая
       15

Jquery DataTable: заголовки таблиц появляются дважды

0 голосов
/ 05 декабря 2011

Я использую Jquery DataTable для отображения данных. 

<style type="text/css" title="currentStyle">
    @import '../css/demo_page.css';
    @import '../css/demo_table.css';
</style>
<script type="text/javascript" language="javascript" src="../scripts/jquery.js"></script>
<script type="text/javascript" language="javascript" src="../scripts/jquery.dataTables.js"></script>

<script type="text/javascript" charset="utf-8">
    $(document).ready(function() {
        $('#example1').dataTable({
            "bAutoWidth": false,
            "sScrollX": "100%",
            "bPaginate": false
        });
    });
</script>                                                   

<div id="demo">
    <table cellpadding="0" cellspacing="0" border="0" class="display" id="example1" >
        <thead>
            <tr>
                <th>Query GeneID</th>
                <th>Hit GeneID</th>
                <th>EXON</th>
                <th>Percentage</th>
                <th>Align Length</th>
                <th>No. of Mismatch</th>
                <th>Gaps</th>
                <th>Start Query Gene</th>
                <th>End Query Gene</th>
                <th>Hit Gene Start </th>
                <th>End Gene Start</th>
                <th>E-Value</th>
                <th>Bit-Score</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td> AA1</td>
                <td>AA3</td>
                <td>AAAAAAAAAAAAA</td>
                <td>AA3</td>
                <td> AA1</td>
                <td> AA1</td>
                <td> AA1</td>
                <td> AA1</td>
                <td> AA1</td>
                <td> AA1</td>
                <td>AA1</td>
                <td>AA1</td>
                <td>AA1</td>
            </tr>
        </tbody>
    </table>
</div>

Когда я пытаюсь попасть на страницу, данные отображаются со всеми полями в <th>, появляющимися дважды. если я удалю: 

"bAutoWidth": false,
"sScrollX": "100%",
"bPaginate": false

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

Подскажите, пожалуйста, где я совершаю ошибку.

Спасибо, Капил

Ответы [ 2 ]

1 голос
/ 08 ноября 2016

Была такая же проблема.

Это сработало для меня: 

"initComplete": function(settings, json) {
    $('.dataTables_scrollBody thead tr').css({visibility:'collapse'});
}

или в CSS: 

div.dataTables_scrollBody thead {           
    display: none;
}
0 голосов
/ 17 января 2015

Включить этот стиль: 

div.FixedHeader_Cloned th,
div.FixedHeader_Cloned td {
    background-color: white !important;
}
...