首页 > 解决方案 > 表格提示框脚本

问题描述

我想创建一个提示,将文本输入到谷歌工作表的特定列(即一组必填字段)

首先,我在编码方面非常缺乏经验,所以到目前为止我的尝试是基于我的在线研究。我确定我通过重复脚本的元素使脚本过于复杂。

我希望它能够执行以下操作

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.');
  }
}

标签: google-apps-script

解决方案


带有文本输入和选择的自定义提示表单

您可以将其用作对话框或 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>

日报:

在此处输入图像描述

电子表格:

在此处输入图像描述


推荐阅读