ML RadioButton List

Die ML RadioButton List bietet eine saubere, Raster-basierte Oberfläche zur Auswahl einer einzelnen Option aus einer Liste. Sie ist die perfekte Wahl für exklusive Selektionen, bei denen alle Optionen auf einen Blick sichtbar sein sollen.

⚙️ 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).
• 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.
• Display Inline: Wenn aktiviert, werden die Radio-Buttons nebeneinander in einer flexiblen Reihe statt untereinander angezeigt.

💻 C# Datenabruf (Value Converter)

Da Radio-Buttons nur eine einzige Auswahl zulassen, wird der Wert über den integrierten Value Converter immer als einfacher String gespeichert und abgerufen.

// Den ausgewählten Schlüssel aus einer ML RadioButton List abrufen
var content = Umbraco.Content("your-node-guid");
string selectedValue = content?.Value<string>("myRadioButtonList");
// Beispiel Ergebnis: "FR"

✅ Validierung

Die ML RadioButton List ist vollständig in das Umbraco-Validierungssystem integriert:

• Unterstützt den nativen Mandatory-Toggle.
• Wenn keine Option ausgewählt ist, verhindert die Komponente das Speichern und zeigt Ihre benutzerdefinierte Fehlermeldung an.
• Ein klares visuelles Feedback erfolgt in der Backoffice-UI, falls die Validierung fehlschlägt.

🔍 Anwendungs-Tipp

Nutzen Sie die ML RadioButton List anstelle eines Dropdowns, wenn Sie eine kleine Anzahl von Optionen haben (z. B. 2-5). Dies verbessert die Benutzererfahrung, da alle Auswahlmöglichkeiten mit einem einzigen Blick sichtbar sind und die Anzahl der benötigten Klicks reduziert wird.