google-apps-script - 表格提示框脚本
问题描述
我想创建一个提示,将文本输入到谷歌工作表的特定列(即一组必填字段)
首先,我在编码方面非常缺乏经验,所以到目前为止我的尝试是基于我的在线研究。我确定我通过重复脚本的元素使脚本过于复杂。
我希望它能够执行以下操作
1 - 单击自定义菜单。2 - 单击添加新风险。3 - 提示框询问 4 个问题序列 - (例如姓名、年龄、地址和工作)。4 - 响应被捕获并放入工作表中的下一个可用行。5 - 提示框取消整个过程,点击叉号或取消按钮。
需要克服的问题
1 - 到目前为止,我可以让脚本询问一系列问题,但是它只会将最后一个问题响应粘贴到下一个可用行。
2 - 我不知道如何取消进程,它只是显示一条消息并执行命令序列
3 - 我需要将我的回复固定到特定列,即 - 并非全部粘贴到 A2、B2、C2、D2 中。例如姓名(A2)、年龄(G2)、地址(H2)、工作(X2)
任何帮助将非常感激
function onOpen() {
SpreadsheetApp.getUi() // Or DocumentApp or SlidesApp or FormApp.
.createMenu('Risk Menu')
.addItem('Add New Risk', 'showPrompt')
.addToUi();
}
function showPrompt() {
var ui = SpreadsheetApp.getUi(); // Same variations.
var ss = SpreadsheetApp.getActiveSpreadsheet();
var targetSheet = ss.getSheetByName("Sheet1");
var range = targetSheet.getRange(targetSheet.getLastRow() + 1, 1);
var result = ui.prompt(
'Add New Risk - Madantory Field 1/4',
'Please enter your name:',
ui.ButtonSet.OK_CANCEL);
var button = result.getSelectedButton();
var text = result.getResponseText();
if (button == ui.Button.OK) {
// User clicked "OK".
range.setValue(text);
} else if (button == ui.Button.CANCEL) {
// User clicked "Cancel".
ui.alert('New risk cancelled');
} else if (button == ui.Button.CLOSE) {
// User clicked X in the title bar.
ui.alert('You closed the dialog.');
}
var result2 = ui.prompt(
'Add New Risk - Mandatory Field 2/4',
'Please enter your address:',
ui.ButtonSet.OK_CANCEL);
var button2 = result2.getSelectedButton();
var text2 = result2.getResponseText();
if (button2 == ui.Button.OK) {
// User clicked "OK".
range.setValue(text2);
} else if (button2 == ui.Button.CANCEL) {
// User clicked "Cancel".
ui.alert('New risk cancelled');
} else if (button2 == ui.Button.CLOSE) {
// User clicked X in the title bar.
ui.alert('You closed the dialog.');
}
var result3 = ui.prompt(
'Add New Risk - Mandatory Field 3/4',
'Please enter your age:',
ui.ButtonSet.OK_CANCEL);
var button3 = result3.getSelectedButton();
var text3 = result3.getResponseText();
if (button3 == ui.Button.OK) {
// User clicked "OK".
range.setValue(text3);
} else if (button3 == ui.Button.CANCEL) {
// User clicked "Cancel".
ui.alert('New risk cancelled');
} else if (button3 == ui.Button.CLOSE) {
// User clicked X in the title bar.
ui.alert('You closed the dialog.');
}
var result4 = ui.prompt(
'Add New Risk - Mandatory Field 4/4',
'Please enter your job role:',
ui.ButtonSet.OK_CANCEL);
var button4 = result4.getSelectedButton();
var text4 = result4.getResponseText();
if (button4 == ui.Button.OK) {
// User clicked "OK".
range.setValue(text4);
} else if (button4 == ui.Button.CANCEL) {
// User clicked "Cancel".
ui.alert('New risk cancelled.');
} else if (button4 == ui.Button.CLOSE) {
// User clicked X in the title bar.
ui.alert('You closed the dialog.');
}
}
解决方案
带有文本输入和选择的自定义提示表单
您可以将其用作对话框或 web 应用程序,因为包含 doGet()。只有几个小模块可以作为 web 应用程序运行。一个在 script.html 文件中标识,带有 webapp 和/或对话框的注释,另一个只是将“取消”按钮的名称更改为“取消/重新加载”。就是这样。
代码.gs:
function onOpen(){
SpreadsheetApp.getUi().createMenu('My Menu')
.addItem("Show Dialog", 'showMyDialog')
.addToUi()
}
function saveData(dObj) {
var ss=SpreadsheetApp.getActive();
var sh=ss.getSheetByName('Sheet1');
var rg=sh.getRange(1,1,1,sh.getLastColumn());
var hA=rg.getValues()[0];
var vA=[];
for(var i=0;i<hA.length;i++) {
vA.push((dObj[hA[i]])?dObj[hA[i]]:'');//Column headers must agree with form names
}
sh.appendRow(vA);
return;
}
function showMyDialog(){
var ui=HtmlService.createTemplateFromFile('TheHtml').evaluate();
SpreadsheetApp.getUi().showModelessDialog(ui, 'Form Data');
}
function doGet(e){
return HtmlService.createTemplateFromFile('TheHtml').evaluate();
}
function include(filename){
return HtmlService.createHtmlOutputFromFile(filename).getContent();
}
function getSelectOptions() {
var ss=SpreadsheetApp.getActive();
var sh=ss.getSheetByName('Options');
var rg=sh.getDataRange();
var vA=rg.getValues();
return vA;
}
html.html:
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<?!= include('resources') ?>
<?!= include('css') ?>
</head>
<body>
<?!= include('form') ?>
<?!= include('script') ?>
</body>
</html>
脚本.html:
<script>
$(function(){
google.script.run
.withSuccessHandler(function(vA) {
$('#sel1').css('background-color','#ffffff');
updateSelect(vA);
})
.getSelectOptions();
});
function updateSelect(vA,id){
var id=id || 'sel1';
var select = document.getElementById(id);
select.options.length = 0;
for(var i=0;i<vA.length;i++)
{
select.options[i] = new Option(vA[i][0],vA[i][1]);
}
}
function getInputObject(obj) {
var rObj={};
for(var i=0;i<Object.keys(obj).length;i++){
//console.log('Name: %s Type: %s',obj[i].name,obj[i].type);
if(obj[i].type=="text"){
rObj[obj[i].name]=obj[i].value;
}
if(obj[i].type=="select-one"){
rObj[obj[i].name]=obj[i].options[obj[i].selectedIndex].value;
}
}
return rObj;
}
function processForm(obj){
var fObj=getInputObject(obj);
//console.log(JSON.stringify(fObj));
google.script.run
.withSuccessHandler(function(rObj){
document.getElementById("btn").disabled=true;
var html='<br /><h1>Data Saved.</h1>';
$(html).appendTo("body");
google.script.host.close();
})
.saveData(fObj);
}
function cancel() {
google.script.host.close();//as dailog
//google.script.run.withSuccessHandler(function(url){window.open(url,'_top');}).getScriptURL();//as a webapp
//https://stackoverflow.com/a/47754851/7215091
}
console.log('My Code');
</script>
表单.html
<h3>Please enter Name, Age, Address and Job Title in the text areas adjacent to the text box descriptions.</h3>
<form id="myForm" onsubmit="event.preventDefault();processForm(this);" >
<br /><select name="Number" id="sel1"></select>
<br /><input type="text" id="txt1" name="Name" /> Name
<br /><input type="text" id="txt2" name="Age" /> Age
<br /><input type="text" id="txt3" name="Address" /> Address
<br /><input type="text" id="txt4" name="Job" /> Job
<br /><input id="btn" type="submit" value="Submit" />
<br />
</form>
<br /><input type="button" value="Cancel/Reload" onClick="cancel();" />
css.html:
<style>
body {background-color:#ffffff;}
input[type="button"],input[type="text"]{margin:0 0 2px 0;}
</style>
资源.html:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
日报:
电子表格:
推荐阅读
- ios - 可扩展 UiTableView 的自定义单元格
- ios - 无法使用新框架构建项目
- sql-server - 我应该为每个一致的数据集还是一个 systemCodes 表创建新表?
- sapui5 - API 参考:在哪里可以找到所有可用于聚合绑定信息对象的属性?
- c# - Newtonsoft - 如果属性丢失,如何抛出异常?
- javascript - 如何在每 24 小时后调用一个 JS 函数并将结果与时间戳一起保存在 cookie 中?
- html - 如何忽略主 CSS 中的引导代码
- ruby-on-rails - Ruby on Rails - 为什么我面临可能无法匹配的约束[:exercise_id]
- java - rethinkdb getNearest: RqlRuntimeError: Array over size limit 100000
- php - 无法加载请求的类:Guzzle