通过简单的HTML表单将基本数据添加到Google Spreadsheet [英] Add basic data to a Google Spreadsheet via a simple HTML Form

问题描述

我有一个带有姓名和电子邮件地址的表单，用户可以填写。

$ b

这是我的表单：

 < form method =postaction =SOME-ACTION-HEREaccept-charset =UTF-8> 
< input type =textname =newletter_nameplaceholder =Name> 
< input type =textname =newletter_emailplaceholder =Email> 
< input type =submitvalue =订阅/> 
< / form> 
  

有没有办法用我自己的自定义HTML表单来做到这一点。我知道你可以为给定的电子表格创建一个Google表单，但是我想用它来作为某种小部件。 解决方案

p>是的，这是可能的。使用一些服务器端的魔法或不。

但重要的是要知道我们正在谈论的女巫服务器，您的服务器或谷歌服务器，因为最终它将服务器端存储在电子表格应用程序:)
我认为这是可能的完全JS（但它会非常痛苦）。
我建议你在这里的解决方案是在谷歌应用程序中继脚本，它将以一种非常简单的方式处理服务器端的魔法：
演示：

您网站上的HTML代码：

 < form id =formmethod =getaction =https://script.google.com/macros/s/AKfycbxeKTVlTkqSGLIRphBrzACjuWlfmejbPIG7NqBxx-7Us7lnqLw / execaccept-charset =UTF-8> 
< input type =textname =newletter_nameplaceholder =Name> 
< input type =textname =newletter_emailplaceholder =Email> 
< input type =submitvalue =订阅/> 
< / form> 
  

以及google应用脚本：

 函数doGet（e）{
 var vals = []; 
 vals.push（new Date（））; 
 for（var i in e.parameter）{
 vals.push（e.parameter [i]）; 
} 
 SpreadsheetApp.openById（0Ao02g19G1-G-dElQQW92ekZWa0lGRGREYUpHRWQwTVE）。appendRow（vals）; 
返回ContentService.createTextOutput（added）; 
 
 
 
 
 
 $ b 
如果你想看到结果，你可以看看电子表格< a href =https://docs.google.com/spreadsheet/ccc?key=0Ao02g19G1-G-dElQQW92ekZWa0lGRGREYUpHRWQwTVE&usp=sharing>此处  
 
你需要知道的是：
 
谷歌应用程序脚本在这里位于电子表格中（但这不是必须的，因为我用他的id调用它的脚本不是必须的）。
 
为了要运行该脚本，您必须发布它并允许任何人运行它。当您执行此操作时，您将获得需要放入HTML代码的已发布网址。这里： https://script.google.com/macros/s/AKfycbxeKTVlTkqSGLIRphBrzACjuWlfmejbPIG7NqBxx-7Us7lnqLw/exec 
 
 
 
希望这对你来说是个满意的答案。
 
I have a form with a Name and an Email address, that the user can fill out.



Now if the user clicks the submit button, I want to send the data to a spreadsheet ideally without using some server-side magic..

This is my Form:
<form method="post" action="SOME-ACTION-HERE" accept-charset="UTF-8">
    <input type="text" name="newletter_name" placeholder="Name">
    <input type="text" name="newletter_email" placeholder="Email">
    <input type="submit" value="Subscribe" />
</form>
Is there a way to do this with my own custom HTML-form. I know that you can create a google form for a given spread sheet, but I want to use it like some sort of widget.
解决方案
Yes this is possible. Using some server side magic or not.

But what's important is to know witch server we are talking about, your server or google server, because in the end it will go server side to be stored on the spreadsheet apps :)

I think this is possible to do it in full JS (but it will be really painfull).

The solution that I propose you here is to relay on a google apps script that will handle the server side magic in a really easy way:
 the demo:

the HTML code on you site:
<form  id="form" method="get" action="https://script.google.com/macros/s/AKfycbxeKTVlTkqSGLIRphBrzACjuWlfmejbPIG7NqBxx-7Us7lnqLw/exec" accept-charset="UTF-8">
    <input type="text" name="newletter_name" placeholder="Name">
    <input type="text" name="newletter_email" placeholder="Email">
    <input type="submit" value="Subscribe"/>
</form>
and here the google apps script:
function doGet(e){
  var vals=[];
  vals.push(new Date());
  for(var i in e.parameter){
    vals.push(e.parameter[i]);
  }
  SpreadsheetApp.openById("0Ao02g19G1-G-dElQQW92ekZWa0lGRGREYUpHRWQwTVE").appendRow(vals);
  return ContentService.createTextOutput("added");
}
If you want to see the result you can have a look to the spreadsheet here

what you need to know:

The google apps script is here located in the spreadsheet (but that's not mandatory as in the script I call it with his id).

In order to run the script you must publish it and allow anyone to run it. When you'll do this action you will get the published URL that you need to put in your HTML code. Here its: https://script.google.com/macros/s/AKfycbxeKTVlTkqSGLIRphBrzACjuWlfmejbPIG7NqBxx-7Us7lnqLw/exec   

Hope this is a satisfying answer for you.

                        
这篇关于通过简单的HTML表单将基本数据添加到Google Spreadsheet的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！