Google Script 网络应用提交后返回空白

问题描述 投票:0回答:0

我创建了一个简单的 Google Script 表单,可以将数据提交到我的 google 表格。 但提交后,表格进入空白页面。我只是复制教程中的代码并按照 T 的说明进行操作。但我仍然得到空白页。

HTML代码:

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
 integrity="sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2" 
crossorigin="anonymous">
<?!= include('JavaScript'); ?>
  </head>
  <body>
    <div class="container">
            <div class="row">
                <div class="col-6">
                    <form id="myForm" onsubmit="handleFormSubmit(this)">
                        <p class="h4 mb-4 text-center">Case Tracking</p>

                        <div class="form-row">
                            <div class="form-group col-sm-12">
                                <label for="cseid">Case ID</label>
                                <input type="text" class="form-control" id="cseid" name="cseid" placeholder="Caseid">
                            </div>
                            </div>
                            <div class="form-group col-md-6">
                              <label for="Origowner">Original Owner</label>
                              <select class="form-control form-control-sm" id="Origowner" name="Origowner">
                                <option selected>Original Owner</option>
                                <option>Ben</option>
                                <option>Tom</option>
                                <option>Cat</option>
                                <option>Dog</option>
                                <option>Food</option>
                                <option>Card</option>
                                <option>Box</option>
                                <option>Chess</option>
                              </select>
                            </div>
                            <div class="form-group col-md-6">
                              <label for="Closingowner">Closing Owner</label>
                              <select class="form-control form-control-sm" id="Closingowner" name="Closingowner">
                                <option selected>Closing Owner</option>
                                <option>Ben</option>
                                <option>Tom</option>
                                <option>Cat</option>
                                <option>Dog</option>
                                <option>Food</option>
                                <option>Card</option>
                                <option>Box</option>
                                <option>Chess</option>
                              </select>
                            </div>
                            <div class="form-group col-md-6">
                              <label for="Emailtype">Email Type</label>
                              <select class="form-control form-control-sm" id="Emailtype" name="Emailtype">
                                <option selected>Email Type</option>
                                <option>Pink</option>
                                <option>Blue</option>
                                <option>red</option>
                                <option>Black</option>
                              </select>
                              </div>
                              <div class="form-group col-md-6">
                              <label for="Emailstate">Email State</label>
                              <select class="form-control form-control-sm" id="Emailstate" name="Emailstate">
                                <option selected>Email State</option>
                                <option>Purple</option>
                                <option>Yellow</option>
                                <option>Green</option>
                                <option>Magenta</option>
                              </select> 
                        </div>

                        <button type="submit" class="btn btn-primary btn-block">Submit</button>
                    </form>
                    <div id="output"></div>
                </div>
            </div>      
        </div>        
  </body>
</html>

代码 GS

function doGet(request) {
  return HtmlService.createTemplateFromFile('Index').evaluate ();
  
}

function include(filename){
  return HtmlService.createHtmlOutputFromFile(filename).getContent();
}

function processForm(formObject){
  var url="https://docs.google.com/spreadsheets/d/10ml41Y6z_W4y9z31LRIKwZAPh9hb40_zafrojm0Tlwo/edit?usp=sharing&resourcekey=0-IC32EU7bLHhnsK2Cd3IeLA"
  var ss= SpreadsheetApp.openByUrl(url);
  var ws=ss.getSheetByName("Data");

  ws.appendRow([
    formObject.cseid,
    formObject.Origowner,
    formObject.Closingowner,
    formObject.Emailtype,
    formObject.Emailstate

  ]);
}

JavaScript

<script>

  function preventFormSubmit(){
    var forms=document.querySelectorAll('form');
    for (var i=0;i<forms.lenght;i++){
      forms[i].addEventListener('submit',function(event){
        event.preventDefault();
      });
    }
  }
window.addEventListener('load',preventFormSubmit);

function handleFormSubmit(formObject){
  google.script.run.processForm(formObject);
  document.getElementById("myForm").reset();
}

</script>

我试过在这里找到答案,但我对此一无所知,因为我只是想通过教程学习

javascript forms google-apps-script web-applications form-submit
© www.soinside.com 2019 - 2024. All rights reserved.