Question

我成功复制了开发人员example code。当我在表单中插入div时，它会失败。如何将“表格div输入”提交给服务器端功能？
*我相信here.中的表格允许使用div和span *取消注释div会导致div'输出'不更新。

HTML：

  <form id="myForm">
    <!--><div>-->
        <input name="myEmail" type="text" />
        <input type="submit" value="Submit"
          onclick="google.script.run.withSuccessHandler(updateEmail)
                    .processForm(this.parentNode)" />
     <!--></div>-->
  </form>
<div id="output">
</div>

<script>
  function updateEmail(response) {
    var div = document.getElementById("output");
    div.innerHTML = "<p>" + response + "</p>";
  }
</script>

code.gs

 function doGet() {
var html = HtmlService.createTemplateFromFile('index').evaluate()
.setTitle('Web App').setSandboxMode(HtmlService
.SandboxMode.NATIVE);
return html;
}

function processForm(formObject) {
  var response = "";
  response = formObject.myEmail;
  return response;
};

编辑：改变：

<input type="button" value="Submit"

为：

<input type="submit" value="Submit"

Answer 1

我将HTML文件更改为：

<form id="myForm">
  <div>
    <input name="myEmail" type="text" />
    <input type="button" value="Submit"
          onclick="processFormJs(this.parentNode)" />
  </div>
</form>

<div id="output"></div>

<script>
window.processFormJs = function(argDivParent) {
  console.log('argDivParent: ' + argDivParent);

  google.script.run.withSuccessHandler(updateEmail)
    .processForm(argDivParent)
};

  function updateEmail(response) {
    var div = document.getElementById("output");
    div.innerHTML = "<p>" + response + "</p>";
  }
</script>

并添加了console.log('argDivParent: ' + argDivParent);声明。然后在开发人员工具中显示控制台。我收到这个错误：

argDivParent: [domado object HTMLDivElement DIV] 
Failed due to illegal value in property: 0

this.ParentNode指的是DIV而不是FORM。如果我取出DIV，返回的对象是：

argDivParent: [domado object HTMLFormElement FORM]

不

argDivParent: [domado object HTMLDivElement DIV]

DIV可能不会自动将INPUT值放入其父对象中。

此代码适用于DIV：

<form id="myForm" onsubmit="processFormJs(this)">

  <div>
    <input name="myEmail" type="text" />
    <input type="button" value="Submit"/>
  </div>

</form>

<div id="output"></div>

<script>
window.processFormJs = function(argDivParent) {
  console.log('argDivParent: ' + argDivParent);

  google.script.run.withSuccessHandler(updateEmail)
    .processForm(argDivParent)
};

  function updateEmail(response) {
    var div = document.getElementById("output");
    div.innerHTML = "<p>" + response + "</p>";
  }
</script>

要进行调试，您可以使用Logger.log("your text here");，然后查看日志。

function processForm(formObject) {
  Logger.log('processForm ran: ' + formObject);
  var response = "";
  response = formObject.myEmail;
  Logger.log('response: ' + response);
  return response;
};

表单输入无法在div中提交

1 个答案: