Bootstrap Datatable with JSF

Question

I am trying to use bootstrap datatables with JSF. I am able to do so. However, the only issue is - When the webpage loads first time then datatable elements such column visibility button, pager, row selection etc don't appear. However, when I refresh the page then these elements get appeared. If I navigate to another page then they disappear again. I have to refresh again to load the elements page. I am trying to debug the issue. However, I couldn't find it out. Can anyone suggest me what could be the possible problem and how can I solve this issue?

$(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>

ow I can solve it?