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 auf dem Frontend sperren, entsperren und umschalten können. Diese Funktionen sind hilfreich, wenn Sie benutzerdefinierte Logik hinzufügen möchten, wie z. B. das Deaktivieren von Feldern nach dem Absenden oder das Festlegen bestimmter Felder als schreibgeschützt auf der Grundlage von Benutzeraktionen.

Hinzufügen Ihres benutzerdefinierten JavaScript

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

Stellen Sie sicher, dass Ihr Code ausgeführt wird, nachdem WPForms geladen wurde, indem Sie ihn in die wpformsReady Veranstaltung.

Verfügbare Methoden

Die folgenden Methoden sind innerhalb der wpforms.field Objekt.

wpforms.field.lock( formId, fieldId )

Sperrt ein bestimmtes Feld, damit 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 Nur-Lese-Status eines bestimmten Feldes.

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

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

Schaltet den Nur-Lese-Status eines Feldes um.

  • true - das Feld sperren
  • false - das Feld freischalten
  • auto" (Standard) - automatische Umschaltung je nach aktuellem Zustand
// 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 Namen der CSS-Klasse zurück, die angewendet wird, wenn ein Feld schreibgeschützt ist.

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

Anmerkungen

  • Ersetzen Sie 123 mit Ihrer Formular-ID und 5 mit der Feld-ID, auf die Sie abzielen möchten.
  • Verwenden Sie immer die wpformsReady Ereignis, um sicherzustellen, dass die Methoden verfügbar sind.
  • Diese Methoden funktionieren nur auf dem Frontend - sie wirken sich nicht auf den Form Builder oder gespeicherte Einträge aus.