gpt4 book ai didi

javascript - 使用谷歌应用程序脚本从电子表格检索数据的按钮操作

转载 作者:行者123 更新时间:2023-12-03 03:35:49 29 4
gpt4 key购买 nike

如何根据对操作(例如单击按钮)的过滤器从电子表格中检索完整行。

我了解到 GAS 是服务器端脚本,访问电子表格很复杂。

是这样吗。请指导我。

我已经做到了:

 $("#form-action")
.button()
.click(function() {

var ss = SpreadsheetApp.openById("");
var sheet = SpreadsheetApp.getActiveSpreadsheet();
SpreadsheetApp.setActiveSheet(sheet.getSheetByName('Test'));
SpreadsheetApp.getActiveSheet().getRange("D1").setFormula('Query(A:C,"SELECT A,B,C WHERE B="' + "mydata'" + ',1)');
SpreadsheetApp.getActiveSheet().getRange("E:J").getValues();

});

最佳答案

访问电子表格一点也不困难。您必须记住,虽然 Google Apps 脚本在 Google 服务器上运行,但客户端代码(例如您在 UI 模板中使用的 HTML 和 JavaScript 代码)将被发送到您的浏览器进行渲染,因此您不能真正混合这两者并在 GAS(.gs) 文件中编写 jQuery 代码,反之亦然。

为了澄清,像

这样的命令
 var ss = SpreadsheetApp.openById("");

必须保存在 .gs 文件中。要使用客户端 HTML 和 JavaScript,您必须在项目中创建单独的 HTML 文件(转到"file"-“新建”-“HTML 文件”)。以下是有关在 GAS 中提供 HTML 的更多信息 https://developers.google.com/apps-script/guides/html/

幸运的是,Google 提供了 API,允许您通过调用“google.script.run”在客户端和服务器端之间进行通信。后跟“.gs”文件中函数的名称。

“.gs”文件中的示例函数

function addRow() {

var sheet = SpreadsheetApp.getActive()
.getSheets()[0];

sheet.appendRow(['Calling', 'server', 'function']);

}

在 HTML 模板文件中,调用此函数的方式如下

<script>
google.script.run.addRow();
</script>

考虑与您的情况更相关的示例。在我的电子表格中,QUERY 公式根据用户输入的值动态更改。带有输入字段的表单显示在侧边栏中。

enter image description here

项目结构

enter image description here

“sidebar.html”的代码如下。请注意,必须使用 <input> 元素的“name”属性。在表单提交时,属性('filterBy')的值将转换为表单对象的属性,我们可以在服务器函数中引用该属性来获取用户输入。

    <!DOCTYPE html>
<html>
<head>
<base target="_top">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
</script>
</head>
<body>
<form id="myForm">

<input type="text" name="filterBy">

<input type="submit" value="submit">

</form>

<table id="myTable"></table>

<script>

$('document').ready(function(){

var form = $('#myForm');
var table = $('#myTable');
var runner = google.script.run;

form.on('submit', function(event){

event.preventDefault(); //prevents <form> redirecting to another page on submit
table.empty(); // clear the table

runner.withSuccessHandler(function(array){ //this callback function will be invoked after the 'retriveValues()' function below

for (var i = 0; i < array.length; i++) {

var item = '<tr><td>' + array[i] +'</td></tr>';
table.append(item);


}


})
.retrieveValues(this); //the function that will be called first. Here, 'this' refers to the form element


});



});


</script>
</body>
</html>

“.gs”文件中的代码:

var ss = SpreadsheetApp.getActive();
var sheet = ss.getSheets()[0];


function onOpen() {

var ui = SpreadsheetApp.getUi();
var htmlOutput = HtmlService.createTemplateFromFile('sidebar')
.evaluate();

ui.showSidebar(htmlOutput);

}


function retrieveValues(req) {

var res = [];
var filterBy = req.filterBy; //getting the value of the input field.

sheet.getRange(1, 2, 1, 1)
.setFormula("QUERY(A1:A, \"SELECT A WHERE A > " + filterBy + "\")");


sheet.getRange(1, 2, sheet.getLastRow(), 1)
.getValues()
.map(function(value){

if (value[0] != "") res = res.concat(value[0]); // get only the values that are not empty strings.

});

return res;


}

这是输入值并提交表单的结果。服务器端函数返回大于 5 的值数组。然后,我们作为参数传递给“withSuccessHandler”的回调函数接收该数组并填充侧边栏中的表格。

enter image description here

最后,我不确定您为什么使用 QUERY 公式。您可以简单地从目标范围中获取值并在 GAS 中过滤它们,而不用修改“SELECT”语句。

关于javascript - 使用谷歌应用程序脚本从电子表格检索数据的按钮操作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45864415/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com