Google sheet Apps script | Hàm setTimeout định thời gian xóa các trường Input khi click Button
Giaoan.link chia sẻ đến các bạn cách sử dụng Google sheet Apps script để xây dựng “Hàm setTimeout định thời gian xóa các trường Input khi click Button”. Hàm này rất thích hợp trong nhiều trường hợp các bạn xây dựng form nhập liệu để reset trường input.
Các bạn truy cập vào đây để tới trang tổng hợp các project excel, google sheet, apps script.
Các bài trong project ngẫu nhiên:
- Web App Script Webapp | Hiệu ứng hoa rơi – Form nhập liệu Gửi nội dung đến email
- Web App Script | Thanh trạng thái Status bar – Giá trị thể hiện theo điểm và label.
- Google sheet Apps script | Data Entry Form – Tự động đọc số tiền thành chữ ở trường input
- Google sheet Apps script | Cập nhật điểm lớp học – Theo danh sách lớp và Theo từng học sinh
- Google sheet, apps script Định dạng dấu phân cách hàng ngàn cho input
- Google sheet apps script | Chọn năm và kiểu biểu đồ để Load dữ liệu lên website
- Google sheet apps script | Scan QR code – Filter and get data table display on webapp
- Google sheet apps script Filter to get data to display on webapp, fill background color for data row
- Google sheet Apps script Webapp | Project Quản lý đơn hàng – Cập nhật sản phẩm – In phiếu kiểm soát
- Google sheet Apps script Webapp | Tạo QR Code động – Tự động load mã QR mới khi nội dung mã hóa đổi
Mã trên trang “Code.gs”
function doGet() {
var output = HtmlService.createTemplateFromFile('Index');
return output.evaluate().setXFrameOptionsMode(HtmlService.XFrameOptionsMode.ALLOWALL);
}
Mã trên trang “Index.html”
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<style>
.container {
width: 600px;
display: block;
margin-left: auto;
margin-right: auto;
padding: 10px;
border: 2px solid red;
border-radius: 10px;
justify-content: center;
background-color: yellow;
}
.container > div {
text-align: left;
font-size: 30px;
}
.button{
display: block;
border: none;
margin: left;
border-radius: 20px;
padding: 10px 20px;
background-color: #d63031;
text-align: cneter;
color: #fff;
font-weight: bold;
cursor: pointer;
}
.button:hover {
background-color: #ee8b71;
color: black;
}
</style>
</style>
</head>
<body>
<div style="height: 20px"></div>
<div class="container">
<p>
<input type="tex" id="name" placeholder="Họ và tên">
<input type="email" id="mail" placeholder="Địa chỉ email">
<input type="text" id="phone" placeholder="Số điện thoại">
</p>
<p>
<input type="text" id="username" placeholder="Điền username">
<input type="password" id="password" placeholder="Điền password">
</p>
<button class="button" type="submit" id="dangky">Đăng ký</button>
</div>
<script>
document.getElementById("dangky").addEventListener("click", (event) => {
setTimeout(function() {
event.preventDefault()
document.getElementById("name").value =""
document.getElementById("mail").value =""
document.getElementById("phone").value =""
document.getElementById("username").value =""
document.getElementById("password").value =""
}, 5000);
})
</script>
</body>
</html>