Data doesn't get saved

[yanivavraham1]

Hey, I'm trying to use this tool to keep contact of my clients but the data doesn't appear to be saved.

I'm getting Email and a new row get created in the sheet but the data is empty

here is my code

handleSubmit https://codefile.io/f/YPUx90dlz7

function doPost(req) { FormEasy.setEmail('{myemail}@gmail.com'); FormEasy.setRecaptcha(_MY_SECRET_KEY) FormEasy.setFields('firstName', 'lastName', 'phone') return FormEasy.action(req); }

[yanivavraham1]

[Basharath]

Looks like the field names are mismatched.

Try to deploy this again with the right field names and use the latest deployed URL for sending requests and that should solve the problem

function doPost(req) {
FormEasy.setEmail('{myemail}@gmail.com');
FormEasy.setRecaptcha(_MY_SECRET_KEY);
FormEasy.setFields('firstName', 'lastName', 'phone');
return FormEasy.action(req);
}

[Oduran19]

did you ever get it fixed because its also not working for me...

[Basharath]

It works great for me. I'm a regular user of it.

Try this demo code and check it out with your URL: https://stackblitz.com/edit/js-55dzc8?file=index.html,index.js

[Oduran19]

app script function doPost(req) { FormEasy.setEmail('[email protected]');

FormEasy.setRecaptcha('----------------------------');

FormEasy.setFields('Fname', 'Lname', 'email', 'phone', 'message', 'reference', 'date');

return FormEasy.action(req); }

// Function to handle form submission document.getElementById('contact-form').addEventListener('submit', function (event) {

    const data = {
        Fname: document.getElementById('Fname').value 
        Lname: document.getElementById('Lname').value,
        email: document.getElementById('email').value,
        phone: document.getElementById('phone').value,
        message: document.getElementById('message').value,
        date: new Date().toISOString(),
    };
    

const url = 'https://script.google.com/macros/s/AKfycbyuYpO5tK4_mry_4SRcU8gPXQYYFncd92zsZF4F52H3NJKgs4HDGXw0wUHgtSnWsASO/exec';

// Make the fetch request to send the form data to Google Apps Script
fetch(url, {
  method: 'POST',
  headers: {
    'Content-Type': 'text/plain;charset=utf-8/'
  },
  body: JSON.stringify(data),
})
  .then((res) => res.json())
  .then((data) => {
    console.log('Form submitted successfully:', data);
    alert('Form submitted successfully!');
  })
  .catch((err) => {
    console.log('Error submitting form:', err);
    alert('There was an error submitting the form.');
  });

});

//html

Send me a message!

Contact Form

First Name:

                        <label for="Lname">Last Name:</label>
                        <input type="text" id="Lname" name="Lname" required>

                        <label for="email">Email:</label>
                        <input type="email" id="email" name="email" required>

                        <label for="phone">Phone:</label>
                        <input type="tel" id="phone" name="phone">

                        <label for="message">Message:</label>
                        <textarea id="message" name="message" rows="4" cols="50" required></textarea>

                    </fieldset>
                    
                    <fieldset>
                        <label for="reference">How did you find me?</label>
                        <select id="reference" name="reference">
                            <option value="friend">Friend</option>
                            <option value="social_media">Social Media</option>
                            <option value="search_engine">Search Engine</option>
                            <option value="other">Other</option>
                        </select>

                        <div class="g-recaptcha" data-sitekey="---------------------"></div>
                        <input type="submit" value="Submit" class="btn">

please help

[Basharath]

Looks like this is missing for recaptcha:

const data = {
  // ...
  gCaptchaResponse: document.getElementById('g-recaptcha-response').value,
};

[Oduran19]

yes but im still having issues, mostly with google script, this is whats on there: function doPost(req) { FormEasy.setEmail('[email protected]'); FormEasy.setRecaptcha('------------------------'); FormEasy.setFields('Fname', 'Lname', 'email', 'website', 'message'); return FormEasy.action(req); }

the JS is :

// Function to handle form submission document.getElementById('contact-form').addEventListener('submit', function (event) { event.preventDefault(); // Prevent the default form submission behavior

const captcha= grecaptcha.getResponse();
if (!captcha) {
    alert('Please complete the CAPTCHA');
    return;
}

const data = {
        Fname: document.getElementById('Fname').value,
        Lname: document.getElementById('Lname').value,
        email: document.getElementById('email').value,
        phone: document.getElementById('phone').value,
        message: document.getElementById('message').value,
        date: new Date().toISOString(),
        gCaptchaResponse: document.getElementById('g-recaptcha-response').value,
        };
    
              
const url = 'https://script.google.com/macros/s/AKfycbx8a7yV7CVl-XOQsNX5wRh9ErMpaMks67Zu-_l2ZK5FekcuH0TvYJxGkU-giUgE5CBnfw/exec';

// Make the fetch request to send the form data to Google Apps Script
fetch(url, {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json'
  },
  body: JSON.stringify(data),
})
  .then((res) => res.json())
  .then((data) => {
    console.log('Form submitted successfully:', data);
    alert('Form submitted successfully!');
    // Reset the form fields
    document.getElementById('contact-form').reset(); 
    captcha.reset();
  })
  .catch((err) => {
    console.log('Error submitting form:', err);
    alert('There was an error submitting the form.');
  });

});

its not even saying im a user on the google script and im having CORS issues as well.

[Oduran19]

i finally got it to work...