как прокрутить только тело dataTable? - PullRequest
0 голосов
/ 11 апреля 2019

У меня проблема с jquery dataTable.

Я хотел бы, чтобы dataTable с scrollY только на теле, я хотел бы, чтобы заголовок всегда был виден ... но scrollY на всех dataTable (tbody + thead):

$('#table_toto').DataTable({
            autoWidth: false,
            columns: [
                {
                    data: 'toto1',
                    width: '40%',
                    default: '-'
                },
                {
                    data: 'toto2',
                    width: '30%',
                    default: '-'
                },
                {
                    data: 'toto3',
                    width: '30%',
                    default: '-'
                },
            ],
            fixedHeader: true,
            paging: false,
            info: false,
            scrollCollapse: true,
            scrollY: '100%',
            drawCallback: function(settings) {
                ...
            },
            "createdRow": function (row, data) {
                ...
            }
        });

DOM:

<div id="table_toto_wrapper" class="table-wrapper">
   <table id="table_toto" class="display table table-striped table-hover">
      <thead>
         <tr>
            <th><span lang="aa">"toto1"</span></th>
            <th><span lang="aa">"toto2</span></th>
            <th><span lang="aa">"toto3"</span>
         </tr>
      </thead>
      <tbody>
      </tbody>
   </table>
</div>

С этим кодом scrollY находится не только в теле: - /

Не могли бы вы мне помочь?

Спасибо

1 Ответ

0 голосов
/ 11 апреля 2019

Я смог сделать это, добавив orderCellsTop: true в свойство fixedHeader:true. Мне также не пришлось использовать свойства scrollCollapse: true или scrollY: 100% вообще.

$('#table_toto').DataTable({
        autoWidth: false,
        columns: [
            {
                data: 'toto1',
                width: '40%',
                default: '-'
            },
            {
                data: 'toto2',
                width: '30%',
                default: '-'
            },
            {
                data: 'toto3',
                width: '30%',
                default: '-'
            },
        ],
        fixedHeader: true,
        orderCellsTop: true,
        paging: false,
        info: false
    });
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...