Google表单:将数据发送到电子表格

Question

如何将数据从网络表单发送到Google电子表格？我使用Google云端硬盘制作了一个表单,但要运行自定义CSS,我需要复制表单标记.

在我的情况下,这是谷歌为发送按钮行为生成的

<form action="https://docs.google.com/forms/d/113H_71nd98TWE0bByjHYNpnC-
 oVA6OBDWtppU30rBrU/formResponse" method="POST" id="ss-form" target="_self" onsubmit="">

但是,我想将自己设计的表单中的数据发布到上面的Google表单响应电子表格中.这是我的表单代码(使用Bootstrap 3):

<form class="form-horizontal" role="form" id="ftk-contact">
<h4>Get in touch with us now</h4>
<div class="form-group">
<label for="inputType" class="col-lg-2 control-label">Type of Inquiry</label>
<div class="col-lg-10">
<select class="form-control" id="inputType">
<option>Request a Quotation</option>
<option>Request a Bluebook</option>
<option>General Inquiry</option>
</select>
</div>
</div>

<div class="form-group">
<label for="inputName" class="col-lg-2 control-label">Name *</label>
<div class="col-lg-10">
<input type="text" class="form-control" id="inputName" placeholder="Your Name">
</div>
</div>

<div class="form-group">
<label for="inputEmail" class="col-lg-2 control-label">Email *</label>
<div class="col-lg-10">
<input type="email" class="form-control" id="inputEmail" placeholder="Your Email">
</div>
</div>

<div class="form-group">
<label for="inputCompany" class="col-lg-2 control-label">Company</label>
<div class="col-lg-10">
<input type="text" class="form-control" id="inputCompany" placeholder="Your Company Name">
</div>
</div>

<div class="form-group">
<label for="message" class="col-lg-2 control-label">Message *</label>
<div class="col-lg-10">
<textarea class="form-control" rows="5" placeholder="Your Message"></textarea>
</div>
</div>

<div class="form-group">
<label for="inputPhone" class="col-lg-2 control-label">Phone</label>
<div class="col-lg-10">
<input type="tel" class="form-control" id="inputPhone" placeholder="Your Phone Number">
</div>
</div>

<div class="form-group">
<label for="inputWeb" class="col-lg-2 control-label">URL</label>
<div class="col-lg-10">
<input type="url" class="form-control" id="inputWeb" placeholder="Your Website URL">
</div>
</div>

<div class="form-group">
<div class="col-lg-offset-2 col-lg-10">
<button type="submit" class="btn btn-primary btn-lg">Send your Inquiry now</button>
</div>
</div>
</form>

使用上述Google表单操作= ...按下发送时,我将转到原始Google表单,而不是将表单条目复制到电子表格中.

如果上述方法不起作用,我还可以将表单数据发送到电子邮件或Google云端硬盘？

Answer 1

这对我有用:

1. 创建自定义表单
2. 点击查看实时表单后,创建您的Google表单并查看来源
3. 复制从<form>开始直到</ form>的html代码
4. Google表单中的每个输入字段都有name和id属性,需要将这些属性复制到您的个人表单中
5. 在表单中使用Google表单的表单操作中的URL.
6. 确保即使是提交按钮也具有与Google表单源匹配的ID和名称属性.
7. 如果您现在提交,则会转到Google表单回复页面.您可以通过提交ajax表单来避免这种情况.

如果您的自定义表单未验证Google表单必填元素,那么您将再次被重定向到Google表单页面.

Answer 2

完整 的分步说明

在阅读了Martin Hawskey的精彩介绍(将数据从HTML表单发送到Google电子表格)并看到一些差距/假设之后,我们决定编写一份详细/全面的教程,其中包含一些人的分步说明发现有用:

https://github.com/dwyl/ HTML -form- 发送 -email-via- 谷歌脚本 -without服务器

该脚本会保存通过HTTP POSTGoogle电子表格发送的所有数据,并可选择将内容转发到电子邮件地址.(如果您希望收到有关新数据的通知,则非常有用)

HTML表格:

结果(表格中的行):

我们对谷歌脚本进行了评论,所以希望它很清楚,但如果您有任何疑问,请不要犹豫!:-)

Answer 3

您可以复制 Google 生成的表单的 HTML，并将其包含在您的自定义 HTML 页面中。这样您就可以根据需要重新设计 google 表单的外观，并使用 jQuery 或类似技术将您自己的逻辑添加到表单中（如果需要）。

这里有一个例子： http ://www.immersionmedia.com/blog/customizing-and-styling-google-forms/