Google表格宏输入表单格式错误的HTML内容

时间:2019-01-29 01:15:50

标签: html google-apps-script google-sheets

我正在Google表格中为我的组织创建一个员工维护系统。

在Code.gs中,我有一个HTML表单。

当我将所有内容放入常规HTML文件中的body标签中时,该窗体看起来与我期望的完全一样。但是在Google表格中,我得到了一个错误。我只看过内联样式的示例,请原谅我。我是新手。

var htmlOutput = HtmlService
  .createHtmlOutput('<body bgcolor=#0082ca><p>Enter new Employee Details</input></p><br><form action="/action_page.php"><div id="fields" style="width:330px;"><p>First name: <input style="margin-bottom:5px;float:right;"type="text" name="fName"></input></p><p>Last name: <input style="margin-bottom:5px;float:right;"type="text" name="lName"></input></p><p>email: <input style="margin-bottom:5px;float:right;"type="email" name="email"></input></p><p>Cell: <input style="margin-bottom:5px;float:right;"type="phone" name="cell"></input></p><p>Direct Line: <input style="margin-bottom:5px;float:right;"type="phone" name="dLine"></input></p><p>Extension: <input style="margin-bottom:5px;float:right;"type="text" name="ext"></input></p><p>Start Date: <input style="margin-bottom:5px;float:right;width:172px;"type="date" name="sDate"></input></p><p><div id="empType" style="border-color:black;border-width:1px;border-type:solid;"><div id="empTypeRadios" style="display:inline-block;width:330px;"><div style="border: 1px solid #aaaaaa;border-radius:25px 25px 0 0;"><div style="display:block;float:left;position:relative;width:50%;margin-top:5px;"><input type="radio" name="payType" value="Hourly"><label="payType">Hourly</label></input></div><div style="display:block;position:relative;float:left;width:50%;margin-top:5px;" ><input type="radio" name="payType" value="Salary"><label="payType">Salary</label></input></div></div></div></div></p><p><div id="company"><div id="companyRadios" style="width:330px;"><div style="border: 1px solid #aaaaaa;"><div style="display:block;float:left;position:relative;width:50%;margin-top:5px;"><input type="radio" name="company" value="CompanyA"><label="company">CompanyA</label></input></div><div style="display:block;position:relative;float:left;width:50%;margin-top:5px;" ><input style="display:block;position:relative;float:left;" type="radio" name="company" value="CompanyB"><label="company">CompanyB</label></input></div></div></div></div></p><p><div id="action" style="border-color:black;border-width:1px;border-type:solid;"><div id="actionRadios" style="display:inline-block;width:330px;"><div style="border: 1px solid #aaaaaa;border-radius:0 0 25px 25px;"><div style="display:block;float:left;position:relative;width:33%;margin-top:5px;"><input type="radio" name="action" value="Add"><label"action">Add </label></input></div><div style="display:block;float:left;position:relative;width:33%;margin-top:5px;"><input type="radio" name="action"  value="Modify"><label"action">Modify </label></input></div><div style="display:block;float:left;position:relative;width:33%;margin-top:5px;"><input type="radio" name="action" value="Archive"><label="action">Archive </label></input></div></div></div></div></p><p><div style="display:block;position:relative;float:left;width:50%;" ><input style="clear:float;margin-bottom:5px;float:left;width:98%;"type="submit" value="Submit"></div><div style="display:block;position:relative;float:left;width:50%;" ><input style="clear:float;margin-bottom:5px;float:left;width:98%;"type="submit" value="Clear"></div></div></form></body>')
  .setWidth(350)
  .setHeight(400);
SpreadsheetApp.getUi().showModalDialog(htmlOutput, 'Employee Add/Archive');

1 个答案:

答案 0 :(得分:0)

是的,所以我的问题是我搞砸了并添加了标签以关闭输入。 我也有其他一些笨拙的html。

我不知道自己在抽烟还是喝酒(因为我不抽烟并且几个月都没有喝酒),但是现在我有了想要的表格。

此外,我发现了一种更好的方法来使用两个文件而不是一个来提供HTML:https://developers.google.com/apps-script/guides/html/