Question

我想将以下HTML表单数据发送到my Google spreadsheet

<!DOCTYPE html>
<html>

<head>
  <title>Post to Google Sheet Demo</title>
  <!-- bootstrap & fontawesome css -->
  <link href="http://cdn.jsdelivr.net/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"/>
  <link rel="stylesheet" href="http://cdn.jsdelivr.net/fontawesome/4.1.0/css/font-awesome.min.css" />

  <!-- BootstrapValidator CSS -->
  <link rel="stylesheet" href="http://cdn.jsdelivr.net/jquery.bootstrapvalidator/0.5.0/css/bootstrapValidator.min.css"/>

  <!-- jQuery and Bootstrap JS -->
  <script type="text/javascript" src="http://cdn.jsdelivr.net/jquery/1.11.1/jquery.min.js"></script>
  <script type="text/javascript" src="http://cdn.jsdelivr.net/bootstrap/3.2.0/js/bootstrap.min.js"></script>

  <!-- BootstrapValidator JS -->
  <script type="text/javascript" src="http://cdn.jsdelivr.net/jquery.bootstrapvalidator/0.5.0/js/bootstrapValidator.min.js"></script>

  <!-- Animated Loading Icon -->
  <style type="text/css">
  .glyphicon-refresh-animate {
      -animation: spin .7s infinite linear;
      -webkit-animation: spin2 .7s infinite linear;
  }

  @-webkit-keyframes spin2 {
      from { -webkit-transform: rotate(0deg);}
      to { -webkit-transform: rotate(360deg);}
  }

  @keyframes spin {
      from { transform: scale(1) rotate(0deg);}
      to { transform: scale(1) rotate(360deg);}
  }
  </style>
</head>
<body>
</head>

<body>
  <div class="container">
  <div class="row">
    <div class="col-lg-12">
      <h2>Post to Google Sheets with form validation</h2>
      <p>
      Based on Martin Hawksey's <a href="http://mashe.hawksey.info/2014/07/google-sheets-as-a-database-insert-with-apps-script-using-postget-methods-with-ajax-example/" target="_blank">example</a>.
      <p>
    </div>
  </div>
  <hr>
  <form class="form-horizontal" role="form" id="test-form">
    <div class="form-group">
      <label class="col-lg-3 control-label">Name of the Corresponding Author</label>
      <div class="col-lg-3 inputGroupContainer">
        <div class="input-group">
          <input type="text" class="form-control" name="Name of the Corresponding Author" placeholder="Please enter the name of the corresponding author"/>
        </div>
      </div>
    </div>

    <div class="form-group">
      <label class="col-lg-3 control-label">Affiliation</label>
      <div class="col-lg-3 inputGroupContainer">
        <div class="input-group">
          <input type="text" class="form-control" name="Affiliation" placeholder="Mr/Mrs/Miss/Dr etc"/>
        </div>
      </div>
    </div>

    <div class="form-group">
      <label class="col-lg-3 control-label">e-mail id</label>
      <div class="col-lg-3 inputGroupContainer">
        <div class="input-group">
          <input type="text" class="form-control" name="e-mail id" placeholder="name@domain.com"/>
        </div>
      </div>
    </div>

    <div class="form-group">
      <label class="col-lg-3 control-label">Mobile No.</label>
      <div class="col-lg-3 inputGroupContainer">
        <div class="input-group col-lg-10">
          <textarea type="number" class="form-control" name="Mobile No." placeholder="Enter your Mobile No. with Country Code" rows="4" style="resize: vertical;"></textarea>
        </div>
      </div>
    </div>

    <div class="form-group">
      <label class="col-lg-3 control-label">Country</label>
      <div class="col-lg-3 inputGroupContainer">
        <div class="input-group col-lg-10">
          <textarea type="text" class="form-control" name="Country" placeholder="Country" rows="4" style="resize: vertical;"></textarea>
        </div>
      </div>
    </div>


      <div class="form-group">
      <label class="col-lg-3 control-label">Accepted Paper Type</label>
      <div class="col-lg-3 inputGroupContainer">
        <div class="input-group">
          <input type="text" class="form-control" name="Accepted Paper Type" placeholder="Abstract/Full Paper"/>
        </div>
      </div>
    </div>


            <div class="form-group">
      <label class="col-lg-3 control-label">Title</label>
      <div class="col-lg-3 inputGroupContainer">
        <div class="input-group">
          <input type="text" class="form-control" name="Title" placeholder="Title of The Paper"/>
        </div>
      </div>
    </div>


          <div class="form-group">
      <label class="col-lg-3 control-label">Keywords (comma seperated, atmost 5)</label>
      <div class="col-lg-3 inputGroupContainer">
        <div class="input-group">
          <input type="text" class="form-control" name="Keywords (comma seperated, atmost 5)" placeholder="Keywords (comma seperated, atmost 5)"/>
        </div>
      </div>
    </div>




          <div class="form-group">
      <label class="col-lg-3 control-label">Name of all Authors (comma seperated)</label>
      <div class="col-lg-3 inputGroupContainer">
        <div class="input-group">
          <input type="text" class="form-control" name="Name of all Authors (comma seperated)" placeholder="Name of all Authors (comma seperated)"/>
        </div>
      </div>
    </div>



          <div class="form-group">
      <label class="col-lg-3 control-label">email id of all authors (comma seperated)</label>
      <div class="col-lg-3 inputGroupContainer">
        <div class="input-group">
          <input type="text" class="form-control" name="email id of all authors (comma seperated)" placeholder="email id of all authors (comma seperated))"/>
        </div>
      </div>
    </div>





    <div class="form-group">
      <div class="col-lg-9 col-lg-offset-3">
        <button type="submit" class="btn btn-default" id="postForm">Submit</button>
      </div>
    </div>

  </form>

  </div>
</body>

<footer>
<script src="validation-functions.js"></script>
</footer>

</html>

原始教程链接here。本教程工作正常，但每当我尝试修改index.html文件以获取我所需的（上面的html代码）表单并将其存储到我的Google电子表格时，它就无法正常工作。我不知道是什么问题。我是HTML代码的新手。请帮帮我一个？提前谢谢。

如何将数据自己的设计HTML表单数据发送到谷歌电子表格？

0 个答案: