Uso de la API de JavaScript para campos de solo lectura

¿Te gustaría controlar los campos de solo lectura en WPForms usando JavaScript?
WPForms proporciona un conjunto de métodos de JavaScript que te permiten bloquear, desbloquear y alternar campos de formulario directamente en el frontend. Estas funciones son útiles si deseas agregar lógica personalizada, como deshabilitar campos después del envío o hacer que ciertos campos sean de solo lectura según las acciones del usuario.

Añadir tu JavaScript personalizado

Para usar estos métodos, necesitarás añadir un fragmento de JavaScript personalizado a tu sitio. Si no estás seguro de cómo añadir código personalizado, consulta nuestra guía sobre cómo añadir JavaScript personalizado para WPForms.

Asegúrate de que tu código se ejecute después de que WPForms se haya cargado, envolviéndolo dentro del evento wpformsReady.

Métodos disponibles

Los siguientes métodos están disponibles dentro del objeto wpforms.field.

wpforms.field.lock( formId, fieldId )

Bloquea un campo específico para que los usuarios puedan verlo pero no editarlo.

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

wpforms.field.unlock( formId, fieldId )

Elimina el estado de solo lectura de un campo específico.

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

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

Alterna el estado de solo lectura de un campo.

• true — bloquear el campo
• false — desbloquear el campo
• ‘auto’ (predeterminado) — cambiar automáticamente según el estado actual

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

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

wpforms.field.isLocked( formId, fieldId )

Comprueba si un campo está actualmente bloqueado. Devuelve un booleano.

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

wpforms.field.lockAll( formId )

Bloquea todos los campos de un formulario.

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

wpforms.field.unlockAll( formId )

Desbloquea todos los campos de un formulario.

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

wpforms.field.readOnlyClass

Devuelve el nombre de la clase CSS que se aplica cuando un campo es de solo lectura.

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

Notas

• Reemplaza 123 con el ID de tu formulario y 5 con el ID del campo que deseas seleccionar.
• Utiliza siempre el evento wpformsReady para asegurarte de que los métodos estén disponibles.
• Estos métodos solo funcionan en el frontend; no afectan al constructor de formularios ni a las entradas guardadas.