ML Dropdown

Der ML Dropdown ist ein vielseitiger und leichtgewichtiger Property-Editor, der eine moderne Auswahloberfläche mit integrierter Suche und Clear-Funktionalität bietet.

⚙️ Konfiguration

Konfigurieren Sie den Editor in den Umbraco Datentyp-Einstellungen in der folgenden Reihenfolge:

• Selection Mode: Wählen Sie aus, wie Sie Ihre Daten bereitstellen möchten:
  • Items: Nutzt die Standard-Umbraco-"Dropdown"-Eingabekonfiguration.
  • Simple: Geben Sie eine Liste von Werten ein, einen pro Zeile (z. B. EN, DE, FR).
  • Enum: Geben Sie den vollqualifizierten Namen Ihres Enums inklusive Namespace ein (z. B. MyProject.Models.Countries).
• Allow Multiple: Wechseln Sie zwischen Einzel- und Mehrfachauswahl.
• Translation Prefix: Fügen Sie ein Präfix hinzu (z. B. Country.), um Übersetzungen automatisch im Umbraco-Dictionary nachzuschlagen.
• Sort Alphabetically: Wenn aktiviert, werden die Optionen A-Z basierend auf ihren Anzeigenamen (übersetzte Namen) statt der Quellreihenfolge sortiert.

💻 C# Datenabruf (Value Converter)

Der ML Dropdown verfügt über einen integrierten Value Converter. Abhängig von Ihrer Einstellung 'Allow Multiple' können Sie die Werte wie folgt abrufen:

// 1. Einzelauswahl
var selectedValue = content?.Value<string>("myDropdown"); 
// Beispiel Ergebnis: "EN"

// 2. Mehrfachauswahl (wenn Allow Multiple aktiviert ist)
var selectedItems = content?.Value<IEnumerable<string>>("myDropdown");
// Beispiel Ergebnis: ["EN", "DE"]

✅ Validierung

Der ML Dropdown ist vollständig in das Umbraco-Validierungssystem integriert:

• Wenn als Pflichtfeld markiert, verhindert der Editor das Speichern, wenn keine Option ausgewählt ist.
• Es wird die in Ihren Datentyp-Einstellungen definierte benutzerdefinierte Fehlermeldung angezeigt.
• Visuelles Feedback erfolgt über einen roten Rand und eine Fehlermeldung unter dem Feld.

📝 Speicher-Hinweis

In der Datenbank wird der Wert bei Einzelauswahl als einfacher String oder bei Mehrfachauswahl als semikolon-getrennter String (z. B. EN;DE;FR) gespeichert. Der Value Converter übernimmt die Umwandlung in IEnumerable<string> automatisch für Sie.

✨ Features

• Live-Suche: Schnelles Filtern durch große Optionslisten.
• Auto-Fokus: Das Suchfeld wird automatisch fokussiert, wenn das Dropdown geöffnet wird.
• Intelligente Positionierung: Das Menü erkennt automatisch Bildschirmränder und öffnet sich nach oben, falls unten nicht genügend Platz ist.