Gibt es eine andere Möglichkeit, die Exportschaltfläche in der Yajra-Datentabelle mit Laravel 5.8 anzuzeigen?
Ich verwende Yajra Datatables, um eine Liste von Benutzern auf der Serverseite abzufragen. Ich habe alle Abhängigkeiten hinzugefügt, aber die Schaltfläche wird nicht angezeigt. Die Schaltflächen sind Kopieren, PDF, CSV und sogar benutzerdefinierte Anzeigeschaltflächen. Ich habe versucht, verschiedene Versionen von JQuery zu verwenden, aber immer noch nichts. Wenn ich die Datentabelle einfach mit dem Datenarray aus der Ansicht initialisiere, werden die Schaltflächen angezeigt und funktionieren einwandfrei. Wenn ich jedoch die Datenquelle von der Routen- und Serverseite aus hinzufüge, werden die Schaltflächen nicht angezeigt. Fehlt etwas? Unten ist mein serverseitiger Verarbeitungscode, die Schaltfläche wird nicht angezeigt. Beim Debuggen erhalte ich auch keine Konsolenfehler.
Datenquelle
public function index(Request $request)
if ($request->ajax()) {
$users = User::select(
"users.id",
"users.first_name",
"users.last_name",
"users.email",
"users.created_at",
"roles.name as role_name")
->join("roles", "roles.id", "=", "users.role_id")
->where("users.status", "=", 1)
->get();
return Datatables::of($users)
->addIndexColumn()
->make(true);
}
return view('users/index');
}
Formular
<table id="example1" class="table table-bordered table-striped">
<thead>
<tr>
<th>Email</th>
<th>First Name</th>
<th>Last Name</th>
<th>Date Added</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
<script>
$(function () {
$("#example1").DataTable({
processing: true,
serverSide: true,
ajax: {
url: '{{ route('users.home') }}',
},
columns: [
{data: 'email', name: 'email'},
{data: 'first_name', name: 'first_name'},
{data: 'last_name', name: 'last_name'},
{
data: "created_at",
"render": function (value) {
if (value === null) return "";
return moment(value).format('DD/MM/YYYY');
}
}
],
"responsive": false, "lengthChange": false, "autoWidth": false,
"buttons": ["copy", "csv", "excel", "pdf", "print", "colvis"]
}).buttons().container().appendTo('#example1_wrapper .col-md-6:eq(0)');
});
</script>
Hier sind meine CSS- und JS-Bibliotheken
CSS
<link rel="stylesheet" href="{{ asset('plugins/datatables-bs4/css/dataTables.bootstrap4.min.css') }}">
<link rel="stylesheet" href="{{ asset('plugins/datatables-responsive/css/responsive.bootstrap4.min.css') }}">
<link rel="stylesheet" href="{{ asset('plugins/datatables-buttons/css/buttons.bootstrap4.min.css') }}">
JS
<script src="{{ asset('plugins/datatables/jquery.dataTables.min.js') }}"></script>
<script src="{{ asset('plugins/datatables-buttons/js/dataTables.buttons.min.js') }}"></script>
<script src="{{ asset('plugins/jszip/jszip.min.js') }}"></script>
<script src="{{ asset('plugins/pdfmake/pdfmake.min.js') }}"></script>
<script src="{{ asset('plugins/pdfmake/vfs_fonts.js') }}"></script>
<script src="{{ asset('plugins/datatables-buttons/js/buttons.html5.min.js') }}"></script>
Wenn ich mit PHP oder Blade durch die Tabelle blättere, werden die Schaltflächen angezeigt:
<?php
if(isset($users) && count($users)>0){
?>
<table id="example1" class="table table-bordered table-striped">
<thead>
<tr>
<th>Email</th>
<th>First Name</th>
<th>Last Name</th>
</tr>
</thead>
<tbody>
<?php
foreach($users as $user){
?>
<tr>
<td><?php echo $user['email']; ?></td>
<td><?php echo $user['first_name']; ?></td>
<td><?php echo $user['last_name']; ?></td>
</tr>
<?php
} ?>
</tbody>
</table>
<?php
}else {
echo "No Users Available";
}
?>
Tabelleninitialisierung
<script>
$("#example1").DataTable({
"responsive": true, "lengthChange": false, "autoWidth": false,
"buttons": ["copy", "csv", "excel", "pdf", "print", "colvis"]
}).buttons().container().appendTo('#example1_wrapper .col-md-6:eq(0)');
});
</script>