How to use Google Forms without iframe?

问题

Some years ago, I found on internet how to use Google forms inside a contact page only using a query in the attribute submit button action without iframe. Now, I can't find it anymore. Is it still possible to use Google forms without iframe?

回答1:

I just found it!

 function postToGoogle() {
   var field1 = $("input[type='radio'][name='qs1']:checked").val();
   var field2 = $('#feed').val();

   $.ajax({
     url: "https://docs.google.com/forms/d/e/1FAIpQLSdjOTKRb7YiWi8OGPq6M6CRL0TpuAsUKacKp2XgruMbIp4wzg/formResponse",
     data: {
       "entry.924752166": field1,
       "entry.997497831": field2
     },
     type: "POST",
     dataType: "xml",
     statusCode: {
       0: function() {
         //Success message
       },
       200: function() {
         //Success Message
       }
     }
   });
 }

/* 
$(document).ready(function() {
   $('#form').submit(function() {
     postToGoogle();
     return false;
   });
   
});
*/

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<strong>Test Google Form</strong>
<form id="form" target="_self" onsubmit="" action="javascript: postToGoogle()">
  <fieldset>
    <label>Question 1</label>
    <input id="qs1_op_1" type="radio" value="Yes" name="qs1" />
    <input id="qs1_op_2" type="radio" value="No" name="qs1" />
  </fieldset>

  <fieldset>
    <label>Text</label>
    <textarea id="feed" name="feed"></textarea>
  </fieldset>
  <div style="width: 100%; display: block; float: right;">
    <button id="send" type="submit">
      Send
    </button>
  </div>
</form>
<br /><br />
The <a href="https://docs.google.com/spreadsheets/d/1bVeLfK2gm6emaGRKHnMllpeb_P4HwwZoIfZB5MCcyZg/pubhtml">Result</a> takes few minutes to be shown, but it is sent to the google sheet instantaneously. 
<br /><br />

It's working in CodePen.

Sending data to Google docs from your web page, using your own form and AJAX!

来源：https://stackoverflow.com/questions/40560853/how-to-use-google-forms-without-iframe

标签

javascript

jquery

html

google-sheets

google-form