Jump to content

MediaWiki:Common.js

From TwainFrame

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
/* Das folgende JavaScript wird für alle Benutzer geladen. */
/* Any JavaScript here will be loaded for all users on every page load. */


console.log('DataTables-Skript wird geladen...');

// DataTables JS nachladen und dann initialisieren
mw.loader.getScript('https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js')
.then(function() {
    console.log('DataTables erfolgreich geladen! Initialisiere Tabelle...');
    $(document).ready(function() {
        $('#catalog').DataTable({
            paging: true,
            pageLength: 100,
            searching: true,
            ordering: true,
            lengthMenu: [ [10, 25, 50, 100, 200, 600], [10, 25, 50, 100, 200, 600] ],
            order: [[1, 'asc']],
            language: {
                search: "Suche:",
                lengthMenu: "Show _MENU_ Entries",
                zeroRecords: "No Matches",
                info: "Page _PAGE_ of _PAGES_",
                infoEmpty: "Empty",
                infoFiltered: "(out of _MAX_ total entries)"
            },
            initComplete: function () {
                // Fügt für jede Spalte ein Suchfeld hinzu
                this.api().columns().every(function () {
                    var column = this;
                    var header = $(column.header());
                    var columnTitle = header.text(); // Spaltentitel extrahieren
                    var input = $('<input type="text" placeholder="' + columnTitle + ' ..." style="width: 100%; padding: 5px;"/>')
                        .appendTo($(header).empty())  // Leert die Headerzelle und fügt das Eingabefeld ein
                        .on('keyup change', function () {
                            column.search(this.value).draw();  // Filtert die Spalte nach Eingabewerten
                        })
                        .on('click', function(e) {
                            e.stopPropagation(); // Verhindert, dass der Klick die Sortierung beeinflusst
                        });
                });
            }
        });
    });
})
.catch(function(err) {
    console.error('Fehler beim Laden von DataTables:', err);
});