When I add the JS handler code, the data is no longer going to the google sheet. I do

Google Drive Link: <a href="https://docs.google.com/spreadsheets/d/1t72LARwbedbHOEia6w

i also have this issue, when i'm adding form handler java to the code, it shows

After adding JS handler, the data is no more going to the sheet about learn-to-send-email-via-google-script-html-no-server HOT 20 CLOSED

dwyl commented on May 9, 2024

After adding JS handler, the data is no more going to the sheet

from learn-to-send-email-via-google-script-html-no-server.

Comments (20)

mckennapsean commented on May 9, 2024 1

JavaScript is the language of the web (only a passing relation to some Java aspects but very different).

FYI, commenting out that line means that the submission handler (all the code that submits your form) is disabled. So I would not expect anything saved or going to email.

What browser/OS do you have? http://www.whatsmybrowser.org/

Hopefully we can figure out what is going on here!

from learn-to-send-email-via-google-script-html-no-server.

mckennapsean commented on May 9, 2024

Not enough details to replicate or debug.

from learn-to-send-email-via-google-script-html-no-server.

rahulshroff30 commented on May 9, 2024

Google Drive Link: https://docs.google.com/spreadsheets/d/1t72LARwbedbHOEia6we57uEY7Ib6ec7QwTz8Xv1n6QM/edit?usp=sharing

<!doctype html>
                                       <head>
                                         <title>Contact Form Example</title>
                                       </head>

                  <body>

                 <!-- START HERE -->

                         <form id="gform" method="post" action="https://script.google.com/macros/s/AKfycbyqC4azk244wSQSEH- OvCEDyOh8NSOF61zMljLk01P9fU4D50M/exec" >


                        FIRST NAME<br/>
                        <input type="text" id="fname" name="fname" /><br/>



                        LAST NAME <br/>
                        <input type="text" id="lname" name="lname" /><br/>




                        EMAIL<br/>
                        <input type="text" id="email" name="email"/><br/>



                        PHONE<br/>
                        <input type="text" id="phone" name="phone" /><br/>



                        COMMENTS OR QUESTIONS<br/>
                        <textarea id="comments" name="comments"></textarea><br/>


                        <input type="submit" id="submit" value="SUBMIT" name="submit"/>

                    </form>

  </form>

                    <!-- Customise the Thankyou Message People See when they submit the form: -->
                   <div style="display:none;" id="thankyou_message">
                   <h2><em>Thanks</em> for contacting us!
                   We will get back to you soon!</h2>
                  </div>


                     <script data-cfasync="false" type="text/javascript"
                    src="https://cdn.rawgit.com/dwyl/html-form-send-email-via-google-script-without-server/master/form-submission-handler.js"></script>
                </body>
              </html>

from learn-to-send-email-via-google-script-html-no-server.

mckennapsean commented on May 9, 2024

Not sure if this is a copy & paste issue, but the form-submission handler javascript file is being added, and there appears to be a space between its URL in the <script> tag above. Check to see if that is in your source file. When you load the page, have you checked the javascript console in your browser to see if any errors are reported?

from learn-to-send-email-via-google-script-html-no-server.

rahulshroff30 commented on May 9, 2024

No there are not any spaces when I enter the handler in the code, probably some copy-paste issue.
I'm facing this issue 'XMLHttpRequest cannot load https://script.google.com/macros/s/AKfycbyqC4azk244wSQSEH-OvCEDyOh8NSOF61zMljLk01P9fU4D50M/exec. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. The response had HTTP status code 401.'

I little new to backend coding, can you help me with this?

from learn-to-send-email-via-google-script-html-no-server.

mckennapsean commented on May 9, 2024

I have seen similar issues if you are running the index.html locally rather than on a server, such as using python or the npm http-server package. Loading certain resources can be tricky without having a basic web server. You could try that out.

from learn-to-send-email-via-google-script-html-no-server.

rahulshroff30 commented on May 9, 2024

Yes, I am running the file locally. When I try to run the index.html that is uploaded in the code section of this topic, I don't see any errors.

from learn-to-send-email-via-google-script-html-no-server.

mckennapsean commented on May 9, 2024

So do you see the XMLHttpRequest error anymore or no? Or only when you submit the form?

from learn-to-send-email-via-google-script-html-no-server.

steveberkhan commented on May 9, 2024

i also have this issue, when i'm adding form handler javascript to the code, it shows the thank you message but it's not sending an e-mail or adding to the google sheet, it works when i copy paste the code you gave in this site, but when i change the google script url to mine ( to make it work for me), it shows the thank you message but it doesn't send e-mails or adding google sheet. But i when i remove the form handler javascript from my code, it also works for my google script url too(but there isn't any thank you message now since form handler is removed). So there appears to be a problem in the form handler javascript i guess, i'm running the html site locally from my computer.(directly clicking the html file) and when i add the form-handler.js in my site, firefox browser console gives this error :

"Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at (my google script here) (Reason: CORS header 'Access-Control-Allow-Origin' missing)."

thanks for any help.

from learn-to-send-email-via-google-script-html-no-server.

steveberkhan commented on May 9, 2024

So yea i'm going for my 6th hour on this issue, have no idea how to deal with java, would totally learn and master java if i spend this 6 hours on it.

Whatever, i finally managed to find which codeline of the javascript causes this issue, it's the last line:
"document.addEventListener('DOMContentLoaded', loaded, false);"

in the form-handler.js

When i remove this, all works like a charm, still no thank you message, when i put this, thank you message comes up but not sending e-mails and not adding to the google sheet.

I just wanted to thank people :'(

from learn-to-send-email-via-google-script-html-no-server.

steveberkhan commented on May 9, 2024

Thanks for the answer, didn't know that line would disable all the script.
Also,
(I'm)You’re using Firefox 48.
Operating system
Windows NT 10.0

from learn-to-send-email-via-google-script-html-no-server.

steveberkhan commented on May 9, 2024

So i'm still searching on this issue, and crossed upon something like this
http://stackoverflow.com/questions/5584923/a-cors-post-request-works-from-plain-javascript-but-why-not-with-jquery
maybe this could be relevant to our problem? Also were you able to find anything about this?

from learn-to-send-email-via-google-script-html-no-server.

steveberkhan commented on May 9, 2024

I think this is the issue, but i have no idea how to add dataType: 'jsonp'.
http://stackoverflow.com/questions/6114436/access-control-allow-origin-error-sending-a-jquery-post-to-google-apis

from learn-to-send-email-via-google-script-html-no-server.

mckennapsean commented on May 9, 2024

Not sure on either of those. I haven't had time to test the issue in Firefox just yet.

The links both refer to using jQuery for sending the form's data to the Google Script. This example tutorial only uses plain Javascript (which the poster said did work for them). The dataType: 'jsonp' portion is a jQuery specific thing.

Now, our headers vary from what I see here, and the cross-origin issues could be cropping up elsewhere. I know that these issues can occur from having javascript files from others (over http) rather than the current server (wherever you are hosting the script). This may or may not be the issue, but if it is then it is a simple fix to download an additional file and reference that rather than the online javascript form-submission-handler.js. Hopefully we can figure out what is going on here.

from learn-to-send-email-via-google-script-html-no-server.

steveberkhan commented on May 9, 2024

I know that these issues can occur from having javascript files from others (over http) rather than the current server (wherever you are hosting the script).

I also had that thought and already downloaded the form-submission-handler.js and run it on current server. That also didn't work.

from learn-to-send-email-via-google-script-html-no-server.

steveberkhan commented on May 9, 2024

Actually it would be easier for me to just find a way that just thanks people after the google script, sending the e-mail then showing the thank you message, i tried to add code on-submit (inside the <form> tag) but then it shows the thank you message for a second then redirects to ugly googlescript "success" message. Can you show me a way that i could stay on same page and show thank you message after google script works? Or maybe a way that google script works on behind?

from learn-to-send-email-via-google-script-html-no-server.

mckennapsean commented on May 9, 2024

The OP seems to have a working thank-you message. And the original tutorial includes one as well. These are separate issues that you have brought up @OdinTR, so please file them accordingly.

I have tested both with and without a server in Firefox 48 on Windows NT 10.0. I could not replicate your issue, @OdinTR - it may depend on what code you are using (both on the form and on the Google Script, including how you set up the script...). There are a lot of variables. I am not even sure what your issue is, as it seems that you have solved some and moved on to others. We run into a lot of challenges in these GitHub Issues since non-technical people attempt to use this more technically-minded tutorial, and a minor misstep is hard for someone to debug (and for us to figure out).

For the OP, @rahulshroff30 - have you had any luck? One thought I had was that maybe you did not follow the steps, numbers 13-16. Without these, nothing would get stored. You have to run a special function first, then save and republish to get the spreadsheet saving working!

from learn-to-send-email-via-google-script-html-no-server.

steveberkhan commented on May 9, 2024

First of all thank you so much for helping me through all of this, i really do appreciate it.
I understand that you won't be able to replicate the issue, therefore i'm thinking of creating a new issue thread if anyone else is having the same problem with me, again thank you very much and have a good day!

from learn-to-send-email-via-google-script-html-no-server.

mckennapsean commented on May 9, 2024

For those having similar troubles, please check #82

from learn-to-send-email-via-google-script-html-no-server.

mckennapsean commented on May 9, 2024

This should be resolved now in the tutorial. I will add to the additional FAQ as well.

from learn-to-send-email-via-google-script-html-no-server.

After adding JS handler, the data is no more going to the sheet about learn-to-send-email-via-google-script-html-no-server HOT 20 CLOSED

Comments (20)

Related Issues (20)

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent