DataTable

by zukii

HTML

<link rel="stylesheet" href="https://cdn.datatables.net/1.10.13/css/jquery.dataTables.min.css">
<script src="https://cdn.datatables.net/1.10.13/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.2.4/css/buttons.dataTables.min.css">
<script src="https://cdn.datatables.net/buttons/1.2.4/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.2.4/js/buttons.colVis.min.js"></script>
<div class="table-responsive">
                                    <table class="table table-responsive table-striped table-bordered dataTable dt-kunde">
                                        <thead>
                                            <tr>
                                                <th>Name</th>
                                                <th>Vorname</th>
                                                <th>Firma</th>
                                                <th>Wohnort</th>
                                                <th>Geburtsdatum</th>
                                                <th>Type</th>
                                                <th>Optionen</th>
                                            </tr>
                                        </thead>
                                        <tfoot>
                                            <tr>
                                                <td>Name</td>
                                                <td>Vorname</td>
                                                <th>Firma</th>
                                                <td>Wohnort</td>
                                                <td>Geburtsdatum</td>
                                                <td>Type</td>
                                                <td>Optionen</td>
                                            </tr>
                                        </tfoot>
                                        <tbody>
                           ...

JavaScript

$('table.dt-kunde').dataTable({

            "order": [
            [0, "asc"]
        ],

            "aoColumnDefs": [
                {
                    type: 'de_date',
                    targets: 4
                },
                {
                    "bSortable": false,
                    "aTargets": [6]
                }
        ],

            "language": {
                "lengthMenu": "Zeige _MENU_",
                "zeroRecords": "Es konnte kein Kunde gefunden werden.</a>",
                "info": "Seite _PAGE_ von _PAGES_",
                "infoEmpty": "Es konnte kein Kunde gefunden werden.",
                "infoFiltered": "(bei _MAX_ angelegten Kunden)",
                "search": " ",
                "paginate": {
                    "first": "Erste",
                    "last": "Letzte",
                    "next": "Vor",
                    "previous": "Zurück"
                },
            },
            dom: 'Bfrtip',
        buttons: [
            {
                extend: 'colvisGroup',
                text: 'Privat ',
                show: [ 0, 1, 3, 4, 5, 6 ],
                hide: [ 2 ]
            },
            {
                extend: 'colvisGroup',
                text: 'Gewerbe ',
                show: [ 0, 1, 2, 3, 5, 6 ],
                hide: [ 4 ]
            },
            {
                extend: 'colvisGroup',
                text: 'Alle',
                show: ':hidden'
            }
        ]
});