Verwendung der JavaScript-API für schreibgeschützte Felder

Möchten Sie schreibgeschützte Felder in WPForms mit JavaScript steuern?
WPForms bietet eine Reihe von JavaScript-Methoden, mit denen Sie Formularfelder direkt im Frontend sperren, entsperren und umschalten können. Diese Funktionen sind hilfreich, wenn Sie benutzerdefinierte Logik hinzufügen möchten, z. B. Felder nach der Übermittlung deaktivieren oder bestimmte Felder basierend auf Benutzeraktionen schreibgeschützt machen.

Hinzufügen Ihres benutzerdefinierten JavaScript

Um diese Methoden zu verwenden, müssen Sie einen benutzerdefinierten JavaScript-Snippet zu Ihrer Website hinzufügen. Wenn Sie nicht sicher sind, wie Sie benutzerdefinierten Code hinzufügen, lesen Sie bitte unsere Anleitung zum Hinzufügen von benutzerdefiniertem JavaScript für WPForms.

Stellen Sie sicher, dass Ihr Code nach dem Laden von WPForms ausgeführt wird, indem Sie ihn in das wpformsReady-Ereignis einschließen.

Verfügbare Methoden

Die folgenden Methoden sind im wpforms.field-Objekt verfügbar.

wpforms.field.lock( formId, fieldId )

Sperrt ein bestimmtes Feld, sodass Benutzer es sehen, aber nicht bearbeiten können.

jQuery(document).on('wpformsReady', function() {
    wpforms.field.lock(123, 5);
});

wpforms.field.unlock( formId, fieldId )

Entfernt den schreibgeschützten Status von einem bestimmten Feld.

jQuery(document).on('wpformsReady', function() {
    wpforms.field.unlock(123, 5);
});

wpforms.field.toggle( formId, fieldId, state )

Schaltet den schreibgeschützten Status eines Feldes um.

  • true — Feld sperren
  • false — Feld entsperren
  • „auto“ (Standard) — automatisch je nach aktuellem Status umschalten
// With explicit state
wpforms.field.toggle(123, 5, true);

// With default behavior ('auto')
wpforms.field.toggle(123, 5);

wpforms.field.isLocked( formId, fieldId )

Prüft, ob ein Feld derzeit gesperrt ist. Gibt einen booleschen Wert zurück.

jQuery(document).on('wpformsReady', function() {
    if ( wpforms.field.isLocked(123, 5) ) {
        console.log('Field is locked');
    }
});

wpforms.field.lockAll( formId )

Sperrt alle Felder in einem Formular.

jQuery(document).on('wpformsReady', function() {
    wpforms.field.lockAll(123);
});

wpforms.field.unlockAll( formId )

Entsperrt alle Felder in einem Formular.

jQuery(document).on('wpformsReady', function() {
    wpforms.field.unlockAll(123);
});

wpforms.field.readOnlyClass

Gibt den CSS-Klassennamen zurück, der angewendet wird, wenn ein Feld schreibgeschützt ist.

console.log( wpforms.field.readOnlyClass );
// 'wpforms-field-readonly'

Notizen

  • Ersetzen Sie 123 durch Ihre Formular-ID und 5 durch die Feld-ID, die Sie ansprechen möchten.
  • Verwenden Sie immer das wpformsReady-Ereignis, um sicherzustellen, dass die Methoden verfügbar sind.
  • Diese Methoden funktionieren nur im Frontend – sie wirken sich nicht auf den Formular-Builder oder gespeicherte Einträge aus.