es.davy.ai

Preguntas y respuestas de programación confiables

¿Tienes una pregunta?

Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.

Cómo configurar dinámicamente el destinatario del correo electrónico en el complemento de formulario de contacto 7 de WordPress.

Me gustaría establecer dinámicamente el destinatario del correo electrónico de un formulario de contacto de wpcf7.

El proceso paso a paso del viaje del usuario es el siguiente:

1) El sitio web ofrece múltiples servicios legales. Un usuario entra en una de estas páginas de servicios y dentro de cada página de servicio hay un elemento que genera un bucle para un tipo de publicación personalizado llamado ‘Solicitor’. Cada solicitante que ofrece este servicio se muestra en una cuadrícula.

2) El usuario hace clic en una llamada a la acción en el solicitante con el que desea ponerse en contacto.

3) Esto desencadena un pop-up (estoy usando el complemento Popup Maker). Este pop-up contiene un formulario simple de wpcf7 con entradas como nombre, correo electrónico, mensaje, etc. El usuario rellena el formulario y envía el formulario de contacto.

4) Quiero que la entrada del formulario de contacto se envíe por correo electrónico al solicitante en el que ha hecho clic el usuario.

Mi enfoque ha sido obtener todas las llamadas a la acción de contacto de los solicitantes y recorrerlas. Cada una de estas llamadas a la acción tiene un atributo data-id con el correspondiente ID de publicación del solicitante.

const solicitorContactBtns = document.querySelectorAll(‘.cta’);

solicitorContactBtns.forEach(solicitorContactBtn => {

solicitorContactBtn.addEventListener(‘click’, () => {

// Tenía la intención de obtener el atributo data-id (ID de publicación) y configurar de alguna manera el correo electrónico del destinatario en el campo personalizado ’email’ de esta ID de publicación. No estoy seguro de cómo hacer esto o si esto es posible.

});

});

Puede que esté utilizando un enfoque equivocado, cualquier ayuda es muy apreciada.

Tags:  , , ,

Answer

  1. Avatar for davy.ai

    Para establecer dinámicamente el destinatario de correo electrónico de un formulario de contacto wpcf7, puedes seguir estos pasos:

    1. Agrega un campo personalizado llamado “email” al tipo de publicación personalizada “Solicitor”. Este campo personalizado contendrá la dirección de correo electrónico del solicitante.
    2. Obtén el ID de publicación del solicitante cuando el usuario hace clic en el botón de llamada a la acción accediendo al atributo “data-id” del botón.
    3. Utiliza AJAX para consultar los datos de meta de publicación del solicitante y obtener la dirección de correo electrónico asociada.
    4. Establece el destinatario de correo electrónico del formulario wpcf7 de forma dinámica utilizando la dirección de correo electrónico obtenida de los datos de meta de publicación.

    Aquí tienes un código de ejemplo que demuestra el enfoque anterior:

    const solicitorContactBtns = document.querySelectorAll('.cta');
    
    solicitorContactBtns.forEach(solicitorContactBtn => {
        solicitorContactBtn.addEventListener('click', () => {
            const solicitorId = solicitorContactBtn.dataset.id;
    
            // Realiza una llamada AJAX para obtener la dirección de correo electrónico asociada con la publicación del solicitante
            const request = new XMLHttpRequest();
            request.onreadystatechange = function() {
                if (this.readyState == 4 && this.status == 200) {
                    const email = JSON.parse(this.responseText).email;
                    const form = document.querySelector('.wpcf7-form');
                    const emailField = form.querySelector('[name="_to"]');
                    emailField.value = email;
                }
            };
            request.open('GET', `https://example.com/wp-json/wp/v2/solicitor/${solicitorId}?_fields=email`, true);
            request.send();
        });
    });
    

    Nota: En el código anterior, reemplaza ‘https://example.com’ con el dominio real de tu sitio de WordPress.

Comments are closed.