在 Google 表格中提交后，弹出表单不会关闭

Question

I'm using my function openDialog to display a custom HTML form.我正在使用我的函数openDialog来显示自定义 HTML 表单。 It will submit fine, but will not close the pop-up window after the form is submitted.它会提交罚款，但不会在表单提交后关闭弹出窗口。 I would like this form to either close after submitting, or show a "thank-you.html" with a "Close" button.我希望此表单在提交后关闭，或者显示带有“关闭”按钮的“thank-you.html”。

.gs .gs

function openDialog() {
  var html = HtmlService.createHtmlOutputFromFile('index.html');
  SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
    .showModalDialog(html, 'Pop up Form');
}

function doGet(e) {
  return HtmlService.createHtmlOutputFromFile('index').setTitle('Adding Rows');
}

function doPost(e) {
  Logger.log(e);
}

function sendText(data) {
  var sheet = SpreadsheetApp.openById("some id").getActiveSheet();
  sheet.appendRow([data.form_field_1, data.form_field_2, data.form_field_3, data.form_field_4]);
  return 'success!';
}

HTML HTML

<html>

<head>
  <base target="_top">
</head>

<body>
  <form onsubmit="sendText(event)" id="test-form">
    <div>
      <label>Field 1</label>
      <input type="text" name="form_field_1" placeholder="Field 1" />
    </div>
    <div>
      <label>Field 2</label>
      <input type="text" name="form_field_2" placeholder="Field 2" />
    </div>
    <div>
      <label>Field 3</label>
      <input type="text" name="form_field_3" placeholder="Field 3" />
    </div>
    <div>
      <label>Field 4</label>
      <input type="text" name="form_field_4" placeholder="Field 4" />
    </div>
    <div>
      <button type="submit" id="submit-form">Submit</button>
    </div>
  </form>
  <script>
    function sendText(e) {
      e.preventDefault();

      var data = {
        form_field_1: e.target['form_field_1'].value,
        form_field_2: e.target['form_field_2'].value,
        form_field_3: e.target['form_field_3'].value,
        form_field_4: e.target['form_field_4'].value
      }

      google.script.run
        .withSuccessHandler(function(response) {
          console.log(response);
          window.close();
        })
        .sendText(data);
    }
  </script>
</body>

</html>

Not sure what I'm doing wrong不知道我做错了什么

Answer 1

Found the fix by doing this.通过这样做找到了修复程序。

<script>
    function sendText(e) {
      e.preventDefault();

      var data = {
        form_field_1: e.target['form_field_1'].value,
        form_field_2: e.target['form_field_2'].value,
        form_field_3: e.target['form_field_3'].value,
        form_field_4: e.target['form_field_4'].value
      }

      google.script.run.withSuccessHandler(function(response) {
        console.log(response);
        google.script.host.close()
      })
      .sendText(data);
    }
</script>

Answer 2

You need something like this:你需要这样的东西：

 function closepopup() { document.getElementById('test-form').style.display = 'none'; } function sendtext() { if(jQuery('#test-form').valid()) { var formurl = 'submit url'; jQuery.ajax({ type: "POST", url: formurl, data: jQuery('#test-form').serialize(true), success: function() { // you can add here redirect the current page or success message closepopup(); } }); } }

 <div> <button type="submit" id="submit-form" onclick="sendtext()">Submit</button> </div>

I hope this will help!我希望这个能帮上忙！

在 Google 表格中提交后，弹出表单不会关闭

问题描述

2 个解决方案

解决方案1
1 2018-09-24 19:06:41

解决方案2
0 2018-09-18 19:36:02

在 Google 表格中提交后，弹出表单不会关闭

问题描述

2 个解决方案

解决方案1 1 2018-09-24 19:06:41

解决方案2 0 2018-09-18 19:36:02

解决方案1
1 2018-09-24 19:06:41

解决方案2
0 2018-09-18 19:36:02