MediaWiki:Common.js

$(function() {
    console.log("Filter-Skript: Starte robusten Modus...");

    mw.loader.using(['jquery.tablesorter'], function() {
        
        $('table.filterable').each(function(tIndex) {
            var $table = $(this);
            
            // Wir suchen die erste Zeile im Body oder die erste Datenzeile
            var $firstDataRow = $table.find('tbody tr').first();
            if ($firstDataRow.length === 0) {
                $firstDataRow = $table.find('tr').has('td').first();
            }

            // Filter-Zeile erstellen, aber als normale Datenzeile tarnen
            // Wir nutzen td statt th, damit der Tablesorter sie nicht als Header ansieht
            var $filterRow = $('<tr class="filter-row" style="background:#f2f2f2 !important; border-bottom: 2px solid #ccc;"></tr>');

            // Wir zählen die Spalten basierend auf der ersten Datenzeile
            var columnCount = $firstDataRow.find('td').length;

            for (var i = 0; i < columnCount; i++) {
                var $filterCell = $('<td style="padding:4px;"></td>');
                var $select = $('<select style="width:100%; font-weight:normal; font-size:0.85em;"><option value="">(Alle)</option></select>');
                
                // Klick-Stop: Verhindert, dass das Klicken im Dropdown die Sortierung triggert
                $select.on('click mousedown', function(e) {
                    e.stopPropagation();
                });

                // Werte sammeln aus allen Spalten (i-ter Index)
                var values = [];
                $table.find('tr').has('td').not('.filter-row').each(function() {
                    var txt = $(this).find('td').eq(i).text().trim();
                    if (txt !== "" && $.inArray(txt, values) === -1) {
                        values.push(txt);
                    }
                });

                values.sort().forEach(function(v) {
                    $select.append($('<option></option>').val(v).text(v));
                });

                $select.on('change', function() {
                    runFilter($table);
                });

                $filterCell.append($select);
                $filterRow.append($filterCell);
            }

            // Trick: Wir fügen die Filter-Zeile in den tbody ein, VOR die erste Datenzeile
            $firstDataRow.before($filterRow);
            
            // MediaWiki mitteilen, dass sich die Tabelle geändert hat, 
            // aber wir markieren die Zeile für den Sorter als "keine Daten"
            $table.trigger('update'); 
            
            console.log("Tabelle " + tIndex + ": Filter erfolgreich vor Datenzeilen platziert.");
        });
    });

    function runFilter($table) {
        var $rows = $table.find('tr').has('td').not('.filter-row');
        var $selects = $table.find('.filter-row select');

        $rows.each(function() {
            var $row = $(this);
            var isVisible = true;

            $selects.each(function(i) {
                var val = $(this).val();
                var cellText = $row.find('td').eq(i).text().trim();
                if (val !== "" && cellText !== val) {
                    isVisible = false;
                    return false;
                }
            });
            $row.toggle(isVisible);
        });
    }
});