Google脚本:ui.prompt,请按Enter键而不是单击按钮来提交

时间:2019-01-23 18:39:59

标签: google-apps-script

如何通过按“ Enter键”而不是单击“确定”来提交Google脚本中的ui.prompt?

到目前为止的代码:

function PromptBox()
{
  var spreadsheet = SpreadsheetApp.getActive();
  var ui=SpreadsheetApp.getUi();
  var prompt=ui.prompt("Filter op... ", "Geef je filterwoord op", ui.ButtonSet.OK)
  var response=prompt.getResponseText();
  var button=prompt.getSelectedButton();
  var filterTekst = "";

  if (button==ui.Button.OK)
  {
   return (filterTekst = response);
  }
  else if(button==ui.Button.CANCEL)
  {
    ui.alert("Je hebt geannuleerd");
  }
}

1 个答案:

答案 0 :(得分:1)

滚动您自己的对话框/提示

您可以通过滚动自己的对话框来完成此操作。这是一种模板化的html方法,因此您必须创建一些文件才能实现它。不必这样做。对我来说,这很容易,因为所有css,资源和脚本文件都已创建,并且我发现在文件而不是字符串中创建javascript更容易。

Google脚本代码:

function showPromptResponse(title,prompt,placeholder){
  var title=title || "Prompt Response";//default used for debug
  var prompt=prompt || "Enter your Response";//default used for debug
  var placeholder=placeholder || "This is the placeholder";//default used for debug
  var html="";
  html+='<!DOCTYPE html><html><head><base target="_top"><?!= include("res1") ?><?!= include("css1") ?></head><body>';
  //html+='<body>';
  html+=Utilities.formatString('<h1>%s</h1>', title);
  html+=Utilities.formatString('<p>%s</p>',prompt);
  html+=Utilities.formatString('<br /><input id="resptext" type="text" size="25" placeholder="%s" />',placeholder);
  html+='<br /><input id="okbtn" type="button" value="Ok" onClick="getResponse();" />';
  html+='<br /><input id="cancelbtn" type="button" value="Cancel" onClick="google.script.host.close();" />';
  html+='<?!= include("promptscript") ?>';
  html+='</body></html>';
  var ui=HtmlService.createTemplate(html).evaluate();//This is a template
  SpreadsheetApp.getUi().showModelessDialog(ui, 'My Prompt');//launch dialog here
}

function loadResponse(resptext) {//This function determines where response is loaded into the spreadsheet.
  SpreadsheetApp.getActive().getActiveSheet().getRange('A1').setValue(resptext);
}

function include(filename){//used in the template for loading file content
  return HtmlService.createHtmlOutputFromFile(filename).getContent();
}

名为promtscript.html的文件中的Java

<script>
  $(function(){
    var input = document.getElementById("resptext");
    input.addEventListener("keyup", function(event) {
      event.preventDefault();//this isn't required since were not doing a submit but it doesn't seem to hurt anything so I left it.
      if (event.keyCode === 13) {//this captures the return keypress
        document.getElementById("okbtn").click();
      }
});
  });
  function getResponse(){
    var responseText=$('#resptext').val();
    console.log(responseText);
    if(responseText){
      google.script.run.loadResponse(responseText);//send response to google script
    }else{
      alert('Invalid or No Response');//response if nothing entered
    }
  }
</script>

res1.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>

css1.html文件是这样的:

<style>
body {background-color:#ffffff;}
input{padding:2px;margin:2px;}
</style>