JavaScript – Referenz

Die Basis liefert neben den Templates auch JavaScript aus. Die hier aufgeführten Funktionen sind global, sie stehen bereit, sobald das Skript-Bundle der Basis geladen ist, und brauchen weder Import noch Initialisierung.

Felder sperren und freigeben

Aus jquery-fmh-validation.js:

Funktion	Für	Setzt zusätzlich
enableTextField(name) / disableTextField(name)	Textfeld, Textarea	fmh-text-field--disabled am Feldgerüst
enableDropdown(name) / disableDropdown(name)	Auswahlbox – klassisch wie Material Design	fmh-select--disabled
enableRadio(name) / disableRadio(name)	Radio-Gruppe (alle Optionen)	fmh-radio--disabled je Option
enableCheckbox(name) / disableCheckbox(name)	Checkbox-Gruppe (alle Kästchen)	fmh-checkbox--disabled je Kästchen
enableButton(id) / disableButton(id)	Schaltflächen	fmh-button-disabled und disabled

Der Parameter ist der Eigenschaftsname aus dem ViewModel, nicht ein Selektor: 'DossierId', nicht '#DossierId'. Ein führendes # wird zwar entfernt und stört nicht, gehört aber nicht hin.

Zwei Abweichungen, die man kennen muss:

• enableButton/disableButton suchen als Klasse, sobald der Wert einen Punkt enthält, sonst als Id. Damit lassen sich mehrere Schaltflächen auf einmal schalten.
• Die Feld-Funktionen greifen auf das Feldgerüst #field_<name> zu, das die FMH-Templates rendern. An einem von Hand geschriebenen <input> wirkt nur das disabled; die Gestaltung bleibt aus.

Ladeanzeige

Aus fmh.js: showLoader(text) und hideLoader(). Beschrieben unter Ui › Feedback › LoadingSpinner, dort steht auch das nötige Markup.

Formularübermittlung

Aus jquery-fmh-validation.js:

Funktion	Wirkung
disableSubmittingFormCheck(selektor)	Schaltet die Mehrfach-Absende-Prüfung für ein Formular ab.

Hier ist der Parameter ein echter jQuery-Selektor, mit #, weil der Wert unverändert an $(...) geht. Das ist die häufigste Verwechslung im Umgang mit diesen Funktionen.

Eigenes Skript auf die Seite bringen

Die Funktionen werden aus eigenem Code aufgerufen. Für dessen Einbindung gibt es zwei Wege:

Weg	Wann
eigene Datei unter wwwroot/js/…, per <script src> geladen	der Regelfall; kommt ohne gelockerte Content-Security-Policy aus
@Html.Script(...) / @Html.PostScript(...)	für Skript, das aus Razor-Werten entsteht; PostScript platziert es nach den Bundles

Alle Demo-Beispiele dieser Rubrik nehmen den ersten Weg und hängen ihre Listener per Delegation an das document, dann spielt der Zeitpunkt des Renderns keine Rolle.