PasswortStatus

Der PasswortStatusBuilder (Fmh.PasswortStatus()) zeigt die geltenden Passwortregeln als Liste und hakt sie während der Eingabe ab. Die Prüfung läuft rein im Browser über das Modul fmh-pw-check-helper.mjs und ersetzt keine serverseitige Validierung.

Regelliste zum Password-EditorTemplate

Die Regeln haken sich während der Eingabe ab – der Builder verbindet sich über For(...) mit der Id, die das EditorTemplate aus dem Eigenschaftsnamen bildet.

@model PasswordBeispielViewModel

@* Das Password-EditorTemplate bildet die HTML-Id aus dem Eigenschaftsnamen. For(...) braucht genau
   diese Id – nameof(...) hält beide Seiten zusammen, auch wenn die Eigenschaft umbenannt wird. *@

<div class="mb-3" style="max-width: 24rem;">
    @Html.EditorFor(m => m.Passwort)
</div>

@Html.Fmh(Fmh.PasswortStatus().For(nameof(Model.Passwort)))

using System.ComponentModel.DataAnnotations;

namespace FMH.Komponente.WebUI.Areas.Basis.Models
{
    public class PasswordBeispielViewModel
    {
        [Display(Name = "Passwort")]
        [UIHint("Password")]
        public string Passwort { get; set; }
    }
}

Darstellung

visibility

The password must meet the following requirements

It must contain uppercase letters.
It must contain lowercase letters.
It must contain at least one digit.
It must contain at least one special character.
It must be at least 12 characters long.

Der PasswortStatusBuilder wird über Fmh.PasswortStatus() erzeugt und mit @Html.Fmh(...) gerendert. Er zeigt die geltenden Passwortregeln und hakt sie während der Eingabe ab. Das Eingabefeld liefert das Password-EditorTemplate:

[Display(Name = "Passwort")]
[UIHint("Password")]
public string Passwort { get; set; }

@Html.EditorFor(m => m.Passwort)

@Html.Fmh(Fmh.PasswortStatus().For(nameof(Model.Passwort)))

Methoden

Methode Erklärung
.For(string id) Die HTML-Id des Passwortfeldes, an das sich die Prüfung hängt. Ohne passende Id passiert nichts — das Modul bricht still ab.

Wie Feld und Regelliste zusammenfinden

Das Password-EditorTemplate bildet die Id aus dem Eigenschaftsnamen (Html.IdFor(...)), aus Passwort wird also id="Passwort". Genau diese Id erwartet For(...) — mit nameof(Model.Passwort) bleiben beide Seiten auch nach einem Umbenennen zusammen.

Ausnahme [UniqueId]: Trägt die Eigenschaft dieses Attribut, hängt das Template ein Zufalls-Suffix an die Id (Passwortmdc4711…). Diese Id entsteht erst beim Rendern und lässt sich im View nicht vorhersagen — For(...) findet das Feld dann nicht mehr, und die Regelliste bleibt stumm. Beides zusammen geht also nicht (siehe Demo-Seite Validierung › UniqueId).

Die geprüften Regeln

Die Regeln stehen im Modul fmh-pw-check-helper.mjs und sind fix; der Builder hat dafür keine Optionen:

Regel Bedingung
Länge mindestens 12 Zeichen
Grossbuchstabe A–Z
Kleinbuchstabe a–z
Ziffer 0–9
Sonderzeichen eines aus !@#$%^&*(),.?":{}|<>

Erfüllte Regeln erhalten die Klasse pw-valid, offene pw-invalid. Die Beschriftungen kommen aus den Ressourcen (_FmhWebMvc.Password…) und sind damit übersetzt.

Was zu beachten ist

  • Die Prüfung läuft nur im Browser. Sie ist eine Eingabehilfe, keine Validierung — die verbindliche Prüfung gehört auf den Server.
  • Die Statuszeilen tragen feste Ids (length, uppercase, lowercase, number, special). Der Baustein gehört deshalb genau einmal auf eine Seite; zwei Regellisten würden sich dieselben Ids teilen und nur die erste würde aktualisiert.
  • Der Builder lädt sein Modul selbst nach (import(...)) und meldet sich beim Feld über initPasswordCheck(...) an. Das Feld muss beim Ausführen im DOM stehen — der Aufruf gehört also nach das Eingabefeld.
  • Das Password-EditorTemplate bringt zusätzlich das Auge zum Ein-/Ausblenden des Passworts mit; beides nutzt dasselbe Modul und kommt sich nicht in die Quere.
  • Ein bereits gefüllter Wert wird beim Initialisieren einmal geprüft, der Status stimmt also auch bei vorausgefüllten Formularen.