How can I hide the datatable column headers during the load of the datatable.

dsand

How can I hide the datatable column headers during the load of the datatable. It looks bad as it takes some time to load. I tried using the modal to hide it but it still displays. I tried positioning the modal to the left but the headers still display and modal displays below it. Here's my code:

    table id="myTable" class="display compact border-dark">
        <thead class="border-primary">
            <tr>
                <th></th>
                <th>
                    @Html.DisplayNameFor(model => model.List[0].Id)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.List[0].Description)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.List[0].Date)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.List[0].Type)
                </th>

            </tr>
        </thead>


    <div id="loadModal" class="modal-body" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
               <!-- <div class="modal-header">
                    <h5 class="modal-title">Modal title</h5>
                </div>  -->
                <div class="modal-body">
                    <div class="spinner-border text-success" role="status">
                        <span class="sr-only">Loading...</span>
                    </div>
                </div>
            </div>
        </div>
    </div>


            $(document).ready(function () {

                $.ajax({
                    type: "Get",
                    url: "/SearchResults?handler=Json",
                    dataType: "json",
                    success: OnSuccess,
                    beforeSend: function () {
                        console.log('before send')
                        $('#loadModal').show();
                    },
                    complete: function () {
                        console.log('complete send')
                        $('#loadModal').hide();
                    }

                });


            });

kthorngren

Duplicate of this thread. See my answer there. Please don't duplicate your questions.

Kevin

dsand

thanks Kevin. I did not format it right. I was trying to edit it, but could not do it after posting it.