Magento 2 Experten — Hyvä Theme, Tailwind CSS & SEO aus einer Hand ›

Filter und Sortierung im Grid konfigurieren

Filter und Sortierung im Grid konfigurieren

~7 Min. Lesezeit Zuletzt aktualisiert am 9. August 2026

Filter und Sortierung wirken auf den ersten Blick wie reine Darstellungsdetails - tatsächlich stecken beide direkt in der Collection-Query, die der DataProvider ausführt. Dieses Kapitel zeigt, wie beides über die XML gesteuert wird, ohne eine Zeile PHP-Filterlogik selbst zu schreiben.

Filtertypen

Der <filter>-Wert einer Spalte entscheidet über das Eingabefeld in der Filterleiste:

  • text - einfaches Textfeld, wird als LIKE %wert% angewendet.
  • select - Dropdown, benötigt eine options-Klasse (Kapitel 6).
  • dateRange - Von-Bis-Datumsauswahl.
  • textRange - Von-Bis-Zahlenfeld, nützlich für numerische Spalten wie eine Bewertung.

Die Volltextsuche

Zusätzlich zu den spaltenspezifischen Filtern bietet die Toolbar eine Volltextsuche über fulltext. Diese sucht standardmäßig nicht automatisch über alle Spalten - welche Spalten durchsucht werden, legt die Collection über addSearchFilter() bzw. eine eigene Filter-Anwendung im DataProvider fest. Für unser Übungsmodul reicht vorerst der Standardfall ohne Volltextsuche, Kapitel 15 zeigt eine konkrete Anwendung bei den Kundenstimmen.

Sortierung

Jede Spalte ist standardmäßig sortierbar, solange sortable nicht explizit auf false gesetzt ist (wie bei der Actions-Spalte in Kapitel 6). Die initiale Sortierung beim ersten Laden der Seite legt <sorting> in den <settings> der jeweiligen Spalte fest:

<column name="created_at">
    <settings>
        <sorting>desc</sorting>
        <dataType>date</dataType>
        <label translate="true">Created At</label>
    </settings>
</column>

Achtung: <sorting> darf nur bei genau einer Spalte gesetzt sein - trägt man es versehentlich bei mehreren Spalten ein, gewinnt meist die zuletzt deklarierte, was zu einem Sortierverhalten führt, das nicht dem sichtbaren XML entspricht und schwer zu debuggen ist.

Sortierung über die Toolbar-Konfiguration

Alternativ (oder zusätzlich) lässt sich die initiale Sortierung auch zentral in der listingToolbar-Sektion über sorting festlegen - praktisch, wenn die Sortierspalte unabhängig von der Spalten-Deklaration konfigurierbar sein soll:

<listingToolbar name="listing_top">
    <argument name="data" xsi:type="array">
        <item name="sticky" xsi:type="boolean">true</item>
    </argument>
    <bookmark name="bookmarks"/>
    <columnsControls name="columns_controls"/>
    <filters name="listing_filters"/>
    <massaction name="listing_massaction"/>
    <paging name="listing_paging"/>
</listingToolbar>

bookmark aktiviert gespeicherte Ansichten (Bookmarks), columnsControls das Ein-/Ausblenden einzelner Spalten - beides ist Standardverhalten, das man in der Regel unverändert übernimmt.

Tipp: Beim Debuggen von Filter- oder Sortierproblemen lohnt sich ein Blick in die Netzwerk-Registerkarte der Browser-Konsole: Der POST-Request an mui/index/render zeigt im Payload exakt, welche Filter- und Sortier-Parameter das Frontend an den DataProvider sendet - oft der schnellste Weg herauszufinden, ob ein Problem im JavaScript oder im PHP liegt.