Bootstrap Datatable с JSF

Question

Я пытаюсь использовать загрузочные таблицы данных с JSF. Я могу это сделать. Однако единственная проблема заключается в следующем: когда веб-страница загружается впервые, элементы данных, такие как кнопка видимости столбца, пейджер, выбор строки и т. Д., Не отображаются. Однако, когда я обновляю страницу, появляются эти элементы. Если я перейду на другую страницу, они снова исчезнут. Я должен обновить еще раз, чтобы загрузить страницу элементов. Я пытаюсь отладить проблему. Однако я не смог это выяснить. Кто-нибудь может подсказать мне, в чем может быть возможная проблема и как я могу решить эту проблему?

$(document).ready(function () {
    $('#bigTable').DataTable(
            {
                "scrollX": true,
                    dom: 'Bfrtip',
                lengthMenu: [
                    [2, 5, 10, -1],
                    ['2 rows', '5 rows', '10 rows', 'Show all']
                ],
                buttons: [
                    'colvis',
                    'pageLength',
                    'csv',
                    'excel'
                ]
            });
});

                            <table id="bigTable" class="table table-striped" style="width:100%">
                                <thead>
                                    <tr class="theme-bg-gray">
                                        <th>Car ID</th>
                                        <th>Car Model</th>
                                        <th>Car Company</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <ui:repeat value="#{car.data}" var="car" varStatus="status">
                                        <tr>
                                            <td> 
                                                <h:outputText value="#{car.id}"/></td>
                                            <td><h:outputText value="#{car.model}"/></td>
                                            <td><h:outputText value="#{car.company}"/></td>
                                        </tr>
                                    </ui:repeat>
                                </tbody>
                            </table>

ау я могу это решить?