Utilisation de l'API JavaScript pour les champs en lecture seule

Souhaitez-vous contrôler les champs en lecture seule dans WPForms à l'aide de JavaScript ?
WPForms fournit un ensemble de méthodes JavaScript qui vous permettent de verrouiller, déverrouiller et basculer les champs de formulaire directement sur le frontend. Ces fonctions sont utiles si vous souhaitez ajouter une logique personnalisée, telle que la désactivation des champs après la soumission ou la définition de certains champs en lecture seule en fonction des actions de l'utilisateur.

Ajout de votre JavaScript personnalisé

Pour utiliser ces méthodes, vous devrez ajouter un extrait de code JavaScript personnalisé à votre site. Si vous ne savez pas comment ajouter du code personnalisé, veuillez consulter notre guide sur l'ajout de JavaScript personnalisé pour WPForms.

Assurez-vous que votre code s'exécute après le chargement de WPForms en l'encapsulant dans l'événement wpformsReady.

Méthodes disponibles

Les méthodes suivantes sont disponibles dans l'objet wpforms.field.

wpforms.field.lock( formId, fieldId )

Verrouille un champ spécifique afin que les utilisateurs puissent le voir mais pas le modifier.

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

wpforms.field.unlock( formId, fieldId )

Supprime l'état de lecture seule d'un champ spécifique.

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

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

Bascule l'état de lecture seule d'un champ.

• true — verrouiller le champ
• false — déverrouiller le champ
• ‘auto’ (par défaut) — basculer automatiquement en fonction de l'état actuel

// With explicit state
wpforms.field.toggle(123, 5, true);

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

wpforms.field.isLocked( formId, fieldId )

Vérifie si un champ est actuellement verrouillé. Renvoie un booléen.

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

wpforms.field.lockAll( formId )

Verrouille tous les champs d'un formulaire.

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

wpforms.field.unlockAll( formId )

Déverrouille tous les champs d'un formulaire.

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

wpforms.field.readOnlyClass

Renvoie le nom de la classe CSS appliqué lorsqu'un champ est en lecture seule.

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

Notes

• Remplacez 123 par l'ID de votre formulaire et 5 par l'ID du champ que vous souhaitez cibler.
• Utilisez toujours l'événement wpformsReady pour vous assurer que les méthodes sont disponibles.
• Ces méthodes fonctionnent uniquement sur le frontend — elles n'affectent pas le constructeur de formulaire ni les entrées enregistrées.