我正在创建一个侧栏,用于在谷歌表格中输入数据。脚本中的所有内容似乎都在工作,直到我到达单击执行部分。当我单击该按钮时,没有任何反应,也没有错误消息。下面是 HTML 和 gs 脚本。任何建议将不胜感激。
**InterDistForm.html Script:**
<!doctype html>
<html lang="en">
<style>
table {
border-spacing: 10px;
width: 100%;
font-size: 14pt;
height: 200px;
border: 1px;
border-radius: 10px;
border-color: darkblue;
background-color: lightblue;
align: center;
}
td {
border-color: white;
}
tr:hover {background-color: #D6EEEE;}
input,
select {
font-size: 12pt;
width: 100%;
}
</style>
<body>
<div>
<table>
<tr>
<td align="left">School Year:</td>
<td align="left"><input type="text" name="schoolYear" value = "2025" disabled/></td>
</tr>
<tr>
<td align="left">Date Received:</td>
<td align="left"><input type="date" name="dateReceived" /></td>
</tr>
<tr>
<th colspan="2"; style="background-color:Cyan;" >Student Information</th>
</tr>
<tr>
<td align="left">Student ID:</td>
<td align="left"><input type="text" name="studentID" value="0"/></td>
</tr>
</table>
<br>
<button id="btnSubmit">Submit</button>
</div>
<script>
function afterButtonClicked(){
var schoolYear = document.getElementById("schoolYear");
var dateReceived = document.getElementById("dateReceived");
var studentID = document.getElementById("studentID");
var rowData = {schoolYear: schoolYear.value
,dateReceived: dateReceived.value
,studentID: studentID.value
};
google.script.run.addInterToForm(rowData);
}
document.getElementById("btnSubmit").addEventListener("click",afterButtonClicked);
</script>
</body>
</html>
**InterDistScript.gs Script:**
var ssTransfers = SpreadsheetApp.getActiveSpreadsheet().getSheetByName("Transfers");
function loadForm() {
const htmlForDialog = HtmlService.createTemplateFromFile("InterDistForm");
const htmlOutput = htmlForDialog.evaluate();
const ui = SpreadsheetApp.getUi();
ui.showSidebar(htmlOutput);
}
function addInterToForm(rowData){
ssTransfers.insertRowAfter(2); //Inserts blank row for data to be placed into
ssTransfers.getRange(3,3,1,3).setValues([[
rowData.schoolYear
,rowData.dateReceived
,rowData.studentID
]]); //needs double []
}
当我对脚本中的值进行硬编码时,脚本正确执行。
现在可以点击按钮。它仍然存在问题,你应该通过验证器运行它。
<!doctype html>
<html lang="en">
<head>
<style>
<title>Title</title>
table {
border-spacing: 10px;
width: 100%;
font-size: 14pt;
height: 200px;
border: 1px;
border-radius: 10px;
border-color: darkblue;
background-color: lightblue;
}
td {
border-color: white;
}
tr:hover {background-color: #D6EEEE;}
input,
select {
font-size: 12pt;
width: 100%;
}
</style>
</head>
<body>
<div>
<table>
<tr>
<td >School Year:</td>
<td ><input type="text" name="schoolYear" value = "2025" disabled/></td>
</tr>
<tr>
<td >Date Received:</td>
<td ><input type="date" name="dateReceived" /></td>
</tr>
<tr>
<th colspan="2" style="background-color:Cyan;" >Student Information</th>
</tr>
<tr>
<td >Student ID:</td>
<td ><input type="text" name="studentID" value="0"></td>
</tr>
</table>
<br>
<button id="btnSubmit" onClick="afterButtonClicked():">Submit</button>
</div>
<script>
function afterButtonClicked(){
console.log("afterButtonClicked");
var schoolYear = document.getElementById("schoolYear");
var dateReceived = document.getElementById("dateReceived");
var studentID = document.getElementById("studentID");
var rowData = {schoolYear: schoolYear.value
,dateReceived: dateReceived.value
,studentID: studentID.value
};
google.script.run.addInterToForm(rowData);
}
document.getElementById("btnSubmit").addEventListener("click",afterButtonClicked);
</script>
</body>
</html>