0

Buen día comunidad tengo un problema, actualmente tengo un script que captura tanto los datos UTM y datos del formulario, los convierte en un Json y los envía un webhook. Mi problema es que actualmente solo hay 3 campos y futuramente habrán aterrizado con 4 o 5 campos de formulario y lo ideal es que los datos se capturen automáticamente sin modificar nada del código nuevamente.

Espero me puedan ayudar

// Capturar datos de formulario y setear el JSON
                function capturar_form(){
                var cookie_ref = decodeURIComponent(document.cookie.replace(/(?:(?:^|.*;\s*)__gtm_campaign_url\s*\=\s*([^;]*).*$)|^.*$/, "$1"));
                var cookie_url = cookie_ref.substring(cookie_ref.indexOf("?")+1);
                var cookie_ref_1 = cookie_url;
                var output = {};
                cookie_url.split(/\s*&\s*/).forEach(function(pair) {
                pair = pair.split(/\s*=\s*/);
                output[pair[0]] = pair.splice(1).join("=");
                  });
                var json = output;
                    var nombre = document.getElementById("et_pb_contact_nombre_0").value;
                    var mail=document.getElementById("et_pb_contact_correo_0").value;
                    var phone=document.getElementById("et_pb_contact_celular_0").value;

      //Capturar url de completo con path
      var URLactual_origin = window.location.origin;
      var urlactual_path = window.location.pathname;
      var url_final = URLactual_origin+urlactual_path;
      // console.log(URLactual_origin + urlactual_path);

                    var json_var = {};
                    json_var.nombre = nombre;
                    json_var.email = mail;
                    json_var.telefono = phone;

      var json_url={};
      json_url.secondary_content=url_final;

      var obj_unidos = JSON.stringify(Object.assign(json_url, json, json_var));

    //Envio de la informacion a Make
    //validar mail
    var regex = /^\w+([\.\+\-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,4})+$/;
    var email_validate = document.getElementById("et_pb_contact_correo_0").value;

if (regex.test(email_validate)) {
      var myHeaders = new Headers();
      myHeaders.append("Content-Type", "application/json");

      var requestOptions = {
        method: 'POST',
        headers: myHeaders,
        body: obj_unidos,
        redirect: 'follow'
      };

      fetch("https://hook.us1.make.com/we83rcy0fa4cvbuojd6nnn3ox37sevc1", requestOptions)
        .then(response => response.text())
        .then(result => console.log(result))
        .catch(error => console.log('error', error));
  } else {
      console.log("La dirección de email es incorrecta.");
  }
                }

1 respuesta 1

0

Puedes crear una especie de serialización, paracido a lo que tenía jQuery, con FormData, de esta manera tomas el form completo y buscas los inputs, luego los guardas en un objeto.

let form = document.querySelector('form');
let formData = new FormData(form);
let object = {};
formData.forEach((value, key) => {
 object[key] = isNaN(Number(value)) ? value : Number(value); //Esto para respetar si es número o no
//object[key] = value; Si solo guardas texto, ocupar esta forma
});
console.info(object);
<form>
<input name="a" value="1" />
<input name="b" value="2" />
<input name="c" value="3" />
<input name="d" value="Casa" />
</form>

1
  • Genial muchas gracias por la respuesta, con jQuery puedo hacer que un botón del form llame al primer formulario que este arriba? es decir si tengo 3 formularios en una landing se puede hacer que tome los datos del primer form que este arriba del boton submit? Commented el 29 sept. 2022 a las 14:27

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.