Multiple table load issues

Good afternoon,
Just wondering if someone could point me in the right direction here. I've been looking through the forums and trying different things to no avail.
The issue I'm having is that I've got 6 tables on one page and some times when I load the page they all load fine, and other times one or more of the tables flags up an error that "DataTables warning: table id=manager - Ajax error. For more information about this error, please see http://datatables.net/tn/7".
In developer tools I'm getting "Failed to load resource: the server responded with a status of 500 (Internal Server Error)".
It looks like the data is coming through but just not displaying.

I'm using laravel 5.4 with SQL database. Each table is displayed in a separate blade view and brought into the main layout as a nested view.

An example of one of my blade templates is as follows:

<div class="row">
    <div class="col-md-12">
        <table id="site_has_employee" class="display nowrap" style="width:100%">
            <thead>
                <tr>
                    <th>View</th>
                    <th>Edit</th>
                    <th>Delete</th>
                    <th>Employee Number</th>
                    <th>First Name</th>
                    <th>Last Name</th>
                    <th>Company</th>
                    <th>Occupation</th>
                    <th>Date Inducted</th>
                    <th>Inducted By</th>
                    <th>FA</th>
                </tr>
            </thead>
        </table>
    </div>
</div>
<div id="sheModal" class="modal fade">
    <div class="modal-dialog modal-sm" role="document">
    <form method="post" id="she_form" enctype="multipart/form-data">
        <div class="modal-content">
            <div class="modal-header">
                <div class="row">
                    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                        <h4 class="modal-title">Employee Inducted</h4>
                    </div>
                </div>
            </div>
            <div class="modal-body">
                <div class="row">
                    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                        <label>Inductor</label>
                        <input type="text" name="inductor_id" id="inductor_id" class="form-control" required/>
                        <br />
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-12 col-md-6 col-sm-12 col-xs-12">
                        <label>Date Inducted</label>
                        <input type="text" name="date_inducted" id="date_inducted" class="form-control" required/>
                        <br />
                    </div>
                </div>
                <br>
            </div>
            <div class="modal-footer">
                <div class="row">
                    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    {{--  <label>Employee Qualification ID</label>  --}}
                        <input type="hidden" name="id" id="id" />
                    {{--  <label>Employee ID</label>  --}}
                        <input type="hidden" name="employee_id" id="employee_id" />
                    {{--  <label>Qualification ID</label>  --}}
                        <input type="hidden" name="site_id" id="site_id" />
                        <input type="hidden" name="operation" id="operation" />
                        <input type="submit" name="action" id="action" class="btn btn-success" value="Add" />
                        <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                    </div>
                </div>
            </div>
        </div>
    </form>
    </div>
</div>
<script type="text/javascript">
$(document).ready(function() {
    var oTableshe = $('#site_has_employee').DataTable({
        processing: true,
        serverSide: true,
        lengthMenu: [[10, 25, 50, -1], [10, 25, 50, "All"]],
        select: "multi",
        searching: true,
        info: true,
        //"scrollY": "500px",
        //"scrollX": true,
        //"scrollCollapse": true,
        paging: true,
        //responsive: true,
        ajax: "{{ route('sites-mgmt.shedatatable.getposts', ['id' => $site_id]) }}",
        dom:
        "<'row'<'col-sm-6'l><'col-sm-6'Bf>>" +
        "<'row'<'col-sm-12'tr>>" +
        "<'row'<'col-sm-5'i><'col-sm-7'p>>",
        columns: [
            {data: 'employee_id', name: 'employee_id', orderable: false, render: function ( data, type, row, meta )
            {
                if(type === 'display')
                {
                    data = '<a href="/nstemployeedetail/' + data + '/"><button class="btn btn-xs btn-primary"><span class="glyphicon glyphicon-eye-open"></span> View</button></a>';
                }
                return data;
            }},
            {data: 'id', name: 'id', orderable: false, render: function ( data, type, row)
            {
                return "<button type='button' class='btn btn-xs btn-info sheupdate' id='id' name='id' > Edit </button>";
            } },
            {data: 'id', name: 'id', orderable: false, render: function ( data, type, row)
            {
                return "<button type='button' class='btn btn-xs btn-danger shedelete' id='id' name='id' > Delete </button>";
            } },
            {data: 'employee_number', name: 'employee_number'},
            {data: 'firstname', name: 'firstname'},
            {data: 'lastname', name: 'lastname'},
            {data: 'company_name', name: 'company.name'},
            {data: 'occupation', name: 'occupation'},
            {data: 'date_inducted', name: 'date_inducted'},
            {data: 'inductor_id', name: 'inductor_id'},
            {data: 'fa', createdCell: function (td, cellData, rowData, row, col)
            {
                var now_date = new Date().getTime();
                var qual_date = Date.parse($(td).text().replace(/(\d{2})\/(\d{2})\/(\d{4})/, '$2/$1/$3'));
                var now_date_plus_two_mth = new Date((+new Date) + 5184000000);
                if(qual_date < now_date)
                {
                    $(td).append('<div class="led-red" id="led-red"></div>')
                }
                else if(qual_date > now_date && qual_date < now_date_plus_two_mth)
                {
                    $(td).append('<div class="led-yellow" id="led-yellow"></div>')
                }
                else if(qual_date > now_date_plus_two_mth)
                {
                    $(td).append('<div class="led-green" id="led-green"></div>')
                }
                else
                {
                    $(td).append('<div class="led-black" id="led-black"></div>')
                }

            } },
        ]
    });
});


</script>

Thanks in advance for any help or advice.

Kind regards

Stephen