<table id="example110" class="table table-striped table-bordered " style="width:100%">
    <thead>
        <tr>
            <th>#</th>
            <th>Mrd. No</th>
            <th>Visit Date</th>
            <th>Patient Name</th>
             <th>Age</th>
              <th>Gender</th>
            <th>Referred Name</th>
           
        </tr>
    </thead>
    <tbody>
        @foreach ($data as $i => $result)
            <tr>
                <td>{{ $i + 1 }}</td>
                <td>{{ $result->MrdNo }}</td>
                <td>{{ $result->VisitDate }}</td>
                <td>{{ strtoupper(strtolower($result->PatientName)) }}</td>
                <td>{{ $result->Age }}</td>
                <td>{{ $result->Gender }}</td>
                <td>{{ $result->RefBy }}</td>
                
            </tr>
        @endforeach
    </tbody>
</table>
<script type="text/javascript">
$(document).ready(function() {
    $('#example110').DataTable({
        scrollX: true,             // Horizontal scroll
        fixedHeader: true,         // Fix thead at top
        pageLength: 5000,           // Show 500 rows
        dom: 'Bfrtip',             // Export buttons on top
        buttons: ['excelHtml5'],    // Excel export
        "scrollY": "400px"
    });
});
</script>
