我已經開始使用 Apps Script 創建一個表單，使用 materializecss 創建一個具有 3 種不同布局的選單。
- 當我將我的 URL 嵌入到新的 Google 站點時，它不使用布局（模式），我需要知道如何選擇 3 個側邊欄選項之一。
- 提交后，表單資料會發布到電子表格，但不會重定向到其他頁面。
- 似乎它會在不驗證資料的情況下重定向，if 陳述句未連接到重定向功能。
function doGet(request) {
return HtmlService.createTemplateFromFile(`form`).evaluate().setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
}
function include(filename){
var url="https://docs.google.com/spreadsheets/d/1sRKhZY27YVY4xMLJs9qAn_lAumaUKT1AH1SgeBrKk_E/edit#gid=0";
var ss= SpreadsheetApp.openByUrl;
var ws=ss.getSheetByName("data");
}
function onOpen(){
var ui=SpreadsheetApp.getUi();
ui.createMenu("My Menu")
.addItem("Sidebar form", "showInsidebarform")
.addItem("Modal Dialog form", "showInmodaldialogform")
.addItem("Modeless Dialog form", "showInmodelessdialog")
.addToUi();
}
//OPEN THE FORM IN SIDEBAR
function showInsidebarform() {
var userform=HtmlService.createTemplateFromFile("form").evaluate().setTitle("Subscribe");
SpreadsheetApp.getUi().showSidebar(userform);
}
//OPEN THE FORM IN MODAL DIALOG
function showInmodaldialogform() {
var userform=HtmlService.createTemplateFromFile("form").evaluate();
SpreadsheetApp.getUi().showModalDialog(userform, "Subscribe");
}
//OPEN THE FORM IN MODELESS DIALOG
function showInmodelessdialog() {
var userform=HtmlService.createTemplateFromFile("form").evaluate();
SpreadsheetApp.getUi().showModelessDialog(userform, "Subscribe");
}
function appenData(data){
var ws=SpreadsheetApp.getActiveSpreadsheet().getSheetByName("data");
ws.appendRow([data.name,data.email]);
}<!DOCTYPE html>
<html>
<head>
<!--Import Google Icon Font-->
<link href="https://fonts.googleapis.com/icon?family=Material Icons" rel="stylesheet">
<!-- Compiled and minified CSS -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
<div class="container">
<div class="row">
<div class="input-field col s12">
<i class="material-icons prefix">account_circle</i>
<input id="name" type="text" class="validate">
<label for="name">First Name</label>
</div>
<div class="input-field col s12">
<i class="material-icons prefix">email</i>
<input id="email" type="text" class="validate">
<label for="email">email</label>
<div class="input-field col s12">
<button class="btn waves-effect waves-light" id="btn">Submit
<i class="material-icons right">send</i>
</button>
</div>
</div><!--end row-->
</div>
<!-- Compiled and minified JavaScript -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
<script>
var nameBox=document.getElementById("name");
var emailBox=document.getElementById("email");
document.getElementById("btn").addEventListener("click",addRecord);
function addRecord(){
var name=nameBox.value;
var email=emailBox.value;
if(name.trim().length==0||email.trim().length==0){
M.toast({html: 'Name and email are required'})
}
else{
var data={
name:nameBox.value,
email:emailBox.value,
};
}
google.script.run.appenData(data);
nameBox.value="";
emailBox.value="";
self.location="https://www.theapothecary.app/homedoctor"
};
</script>
</body>
</html>我在這里發布我的完整代碼，它歸功于：https ://www.youtube.com/watch?v=4SqsK3Vh42Q&lc=UgzHk8aEXCtiDyh8e0B4AaABAg.9ZmDWeons-P9ZmyFFSUhEJ
uj5u.com熱心網友回復：
如果你想做一個注冊系統我推薦php
<!DOCTYPE html>
<html>
<head>
<!--Import Google Icon Font-->
<link href="https://fonts.googleapis.com/icon?family=Material Icons" rel="stylesheet">
<!-- Compiled and minified CSS -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<!--Let browser know website is optimized for mobile-->
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
</head>
<body>
<div class="container">
<div class="row">
<div class="input-field col s12">
<i class="material-icons prefix">account_circle</i>
<input id="name" type="text" class="validate">
<label for="name">First Name</label>
</div>
<div class="input-field col s12">
<i class="material-icons prefix">email</i>
<input id="email" type="text" class="validate">
<label for="email">email</label>
<div class="input-field col s12">
<button class="btn waves-effect waves-light" id="btn">Submit
<i class="material-icons right">send</i>
</button>
</div>
</div><!--end row-->
</div>
<!-- Compiled and minified JavaScript -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
<script>
var nameBox=document.getElementById("name");
var emailBox=document.getElementById("email");
document.getElementById("btn").addEventListener("click",addRecord);
function addRecord(){
var name=nameBox.value;
var email=emailBox.value;
if(name.trim().length==0||email.trim().length==0){
M.toast({html: 'Name and email are required'})
}
else{
var data={
name:nameBox.value,
email:emailBox.value,
};
window.open("https://www.theapothecary.app/homedoctor")
}
google.script.run.appenData(data);
nameBox.value="";
emailBox.value="";
self.location="https://www.theapothecary.app/homedoctor"
};
</script>
</body>
</html>
如果這不是您問題的答案。你能更清楚地解釋問題出在哪里嗎
轉載請註明出處，本文鏈接：https://www.uj5u.com/qita/446191.html
標籤：javascript html