google-apps-script - 如果第 1 行已填满且用户需要订购超过 1 个产品,如何在 Material Request Web 应用程序中添加新行
问题描述
我在一个网络应用程序中工作作为材料请求,因此用户可以根据他们的需要填写,现在网络应用程序可以工作,但如果有人需要超过 1 个产品,他们将需要填写表格 X 次。如果填充了“第 1 行”(选择的材料和数量),我正在寻找一种向界面添加新“行”的方法。
谢谢
这是脚本项目的链接
解决方案
const row = function(count) {
return `
<div class="row">
<div class="input-field col s6">
<select id ="options${count}" onchange="productSelected(this.id)">
<option value="" disabled="" selected="">Select your Products</option>
<option>Hojas</option>
<option>Plumas</option>
<option>Grapas</option>
<option>Cinta</option>
<option>Toner</option>
<option>Otros</option>
<option>Varios</option>
<option>Herramientas</option>
</select>
<label>Products</label>
</div>
<div class="input-field col s6">
<input id="qty" type="number" class="validate">
<label for="qty">Qty</label>
</div>
</div><!-- Close Row -->`;
};
function appendRow() {
count++;
document.querySelector('.container .row:last-child').insertAdjacentHTML('beforebegin', row(count));
const element = document.getElementById(`options${count}`);
M.FormSelect.init(element);
}
let count = 0;
window.onload = function() {
appendRow();
};
function productSelected(id) {
if (id === `options${count}`) { appendRow(); }
}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
<div class="container">
<div class="row" >
<button id="btn" class="waves-effect waves-light btn-small blue darken-3"><i class="material-icons left">add_shopping_cart</i>Send</button>
</div><!-- Close Row -->
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
推荐阅读
- javascript - d3:使用 DataMaps 创建美国地图
- continuum - 在云中运行 Continuum 并在我们的本地 CI 服务器中触发 CI 作业,而无需更改防火墙
- c++ - Boost Spirit - 使用 -O1 而不是 -O2 构建项目
- java - Spring数据顺序搜索正确
- wpf - 带有自动刷新的 Web 浏览器的 PowerShell 表单
- python - 使用网络路径检索 os.listdir
- javascript - 承诺链在第一次承诺返回时退出
- python - 如果出现错误,如何输入占位元素?
- r - Debian stretch ~ 安装包 'tidyverse' 的退出状态非零 ~ R.3.3.3
- wordpress - 无法在 wordpress 中设置默认布局