Utilizzo dell'API JavaScript per campi di sola lettura

Vuoi controllare i campi di sola lettura in WPForms usando JavaScript?
WPForms fornisce una serie di metodi JavaScript che ti consentono di bloccare, sbloccare e attivare/disattivare i campi del modulo direttamente sul frontend. Queste funzioni sono utili se desideri aggiungere logica personalizzata, come disabilitare i campi dopo l'invio o rendere determinati campi di sola lettura in base alle azioni dell'utente.

Aggiungere il tuo JavaScript personalizzato

Per utilizzare questi metodi, dovrai aggiungere uno snippet JavaScript personalizzato al tuo sito. Se non sei sicuro di come aggiungere codice personalizzato, consulta la nostra guida su come aggiungere JavaScript personalizzato per WPForms.

Assicurati che il tuo codice venga eseguito dopo il caricamento di WPForms racchiudendolo nell'evento wpformsReady.

Metodi disponibili

I seguenti metodi sono disponibili all'interno dell'oggetto wpforms.field.

wpforms.field.lock( formId, fieldId )

Blocca un campo specifico in modo che gli utenti possano vederlo ma non modificarlo.

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

wpforms.field.unlock( formId, fieldId )

Rimuove lo stato di sola lettura da un campo specifico.

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

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

Attiva/disattiva lo stato di sola lettura di un campo.

  • true — blocca il campo
  • false — sblocca il campo
  • ‘auto’ (predefinito) — passa automaticamente a seconda dello stato corrente
// With explicit state
wpforms.field.toggle(123, 5, true);

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

wpforms.field.isLocked( formId, fieldId )

Verifica se un campo è attualmente bloccato. Restituisce un booleano.

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

wpforms.field.lockAll( formId )

Blocca tutti i campi di un modulo.

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

wpforms.field.unlockAll( formId )

Sblocca tutti i campi di un modulo.

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

wpforms.field.readOnlyClass

Restituisce il nome della classe CSS applicata quando un campo è di sola lettura.

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

Note

  • Sostituisci 123 con l'ID del tuo modulo e 5 con l'ID del campo che desideri selezionare.
  • Usa sempre l'evento wpformsReady per assicurarti che i metodi siano disponibili.
  • Questi metodi funzionano solo sul frontend — non influiscono sul generatore di moduli o sulle voci salvate.