index.html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>สร้างช่องทำเครื่องหมาย(Checkbox)ใน Google ชีตโดยใช้ Apps Script</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<h1>Hello, world!</h1>
<div class="container">
<form onsubmit="savedata(this)">
<div class="row g-3">
<div class="col-md-6">
<input type="text" class="form-control" id="fname" name="fname" placeholder="First name">
</div>
<div class="col-md-6">
<input type="text" class="form-control" id="lname" name="lname" placeholder="Last name">
</div>
<div class="col-md-6">
Contact you
<div class="form-check">
<input class="form-check-input" type="checkbox" value="true" id="checkA" name="checkA">
<label class="form-check-label" for="flexCheckDefault">
Facebook
</label>
</div>
<div class="form-check">
<input class="form-check-input" type="checkbox" value="true" id="checkB" name="checkB">
<label class="form-check-label" for="flexCheckChecked">
Line
</label>
</div>
<div class="col-12">
<button type="submit" class="btn btn-primary">Sign in</button>
</div>
</div>
</div>
</form>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
<script>
function savedata(e){
event.preventDefault()
google.script.run.withSuccessHandler( data => {
true ? alert("Success") : alert("Save failed")
}).saveData(e)
}
</script>
code.gs
function doGet() {
return HtmlService.createTemplateFromFile('index').evaluate()
.setTitle("สร้างช่องทำเครื่องหมาย(Checkbox)ใน Google ชีตโดยใช้ Apps Script")
.addMetaTag('viewport', 'width=device-width, initial-scale=1')
.setFaviconUrl("https://semicon.github.io/img/taksila_logo.png")
.setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL)
}
function saveData(e){
const ssh = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet()
ssh.appendRow([
new Date().getTime().toString(),
new Date(),
e.fname,
e.lname,
])
const checkbox = SpreadsheetApp.newDataValidation().requireCheckbox().setAllowInvalid(false).build()
const statusCheckA = ssh.getRange("E"+(ssh.getLastRow()))
const statusCheckB = ssh.getRange("F"+(ssh.getLastRow()))
statusCheckA.setDataValidation(checkbox).setValue(e.checkA)
statusCheckB.setDataValidation(checkbox).setValue(e.checkB)
return true
}
https://docs.google.com/spreadsheets/d/1URfEAB3d4_26XoMBre1eLsD1ps5HkDBGOsYCdhvcUFc/edit?usp=sharing
Ref. Class DataValidationBuilder | Apps Script | Google for Developers