jQuery Mobile Filter

Filterbare Elemente

Jedes Element mit einem oder mehreren untergeordneten Elementen kann filterbar sein.

So erstellen Sie ein Suchfeld:

• Das Element, das Sie filtern möchten, muss das Attribut data-filter="true" verwenden.
• Erstellen Sie ein <input>-Element, geben Sie eine id an und fügen Sie dem Element das Attribut data-type="search" hinzu. Dadurch wird ein einfaches Suchfeld erstellt. Platzieren Sie das <input>-Element in einem Formular und verwenden Sie die Klasse "ui-filterable" für das <form>-Element - diese Klasse passt die Abstände zwischen dem Suchfeld und dem filterbaren Element an.
• Fügen Sie dann dem gefilterten Element das Attribut data-input hinzu. Der Wert muss die id des <input>-Elements sein.

Als Nächstes erstellen wir eine filterbare Liste:

Tipp:Sie können das placeholder-Attribut im Suchfeld verwenden, um Hinweistext festzulegen:

Benutzerdefinierter Filter

Normalerweise wird der in jedes Listenelement eingefügte Text als Filtertext verwendet (z. B. A entspricht "Adele" oder B entspricht "Billy"). Wenn Sie jedoch benutzerdefinierten Filtertext angeben möchten, müssen Sie das data-filtertext-Attribut für untergeordnete Elemente verwenden:

	Wenn Sie das data-filtertext-Attribut für ein Element verwenden, wird der Quelltextinhalt des Elements während der Filterung ignoriert. Wenn Sie in diesem Fall das Listenelement "Adele" weiterhin finden möchten, müssen Sie die folgenden Schlüsselwörter verwenden: f, a, v oder fav.

Weitere Beispiele

Wie man eine aufklappbare Liste filtert.

Wie man Tabelleninhalte filtert.

Wie man untergeordnete <p>-Elemente filtert, die in einem <div>-Element enthalten sind.