How to change values in cell of Google Sheet from custom HTML sidebar?
Question
I have a Google spreadsheet with custom sidebar. Sidebar contains a form with <textarea> only. The <textarea> takes value from table cell with script. I want to send new value from sidebar to the same cell by onchange trigger or keep old value in the cell if it's not changed by user. You can see below what I have. Unfortunately it does not work. Does not work means the sidebar takes value from the cell but don't send new one after changing. I don't understand why where I'm wrong and how to fix it?
function showSidebar() { var html = HtmlService.createHtmlOutputFromFile('Change.html').setTitle('Cooking method').setWidth(300); SpreadsheetApp.getUi().showSidebar(html); } function addNewMethod(form_data) { var ss = SpreadsheetApp.getActiveSpreadsheet(); var sheet = ss.getSheetByName('Method'); var cookingMethod = form_data.method; sheet.getRange('A2').setValue(cookingMethod); } function getDefaultMethod() { const ss = SpreadsheetApp.getActiveSpreadsheet(); const sheet = ss.getSheetByName('Method'); const currentMethod = sheet.getRange('A2').getValue(); return currentMethod }
<:doctype html> <html lang="en"> <head> <base target="_top"> <link rel="stylesheet" href="https.//ssl.gstatic.com/docs/script/css/add-ons1:css"> <meta charset="utf-8"> <title>change</title> <style> body{ background-color; #3366CC: } textarea { margin. 10px } </style> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script> $(function() { google.script.run.withSuccessHandler(updateMethod);getDefaultMethod(); }). function updateMethod(method_val) { document.getElementById('method');innerHTML=method_val. } </script> </head> <body> <form id="mysidebar"> <div class="block form-group"> <label for="method"></label> <textarea id="method" name="method" rows="30" cols="45"> </textarea> </div> </form> <div></div> <script> $("method").change(function () { google.script.run;addNewMethod(this). });change(); </script> </body> </html>
1 answers
solution1
2 ACCPTED 2020-05-04 01:32:26
I believe your goal and situation as follows.
- You want to send the value of textarea to
addNewMethodof Google Apps Script. - When you changed the textarea and remove the focus, you want to send it to GAS side.
- In your this situation, you don't use the Google Apps Script library. The GAS and HTML file are put in one GAS project of the container-bound script.
For this, how about this modification?
At first, please check whether my understanding of your this question is correct.
Modified script:
In this case, please modify your HTML&Javascript as follows. In this modification, as a simple modification, I didn't modify your Google Apps Script side.
From: $("method").change(function () { google.script.run.addNewMethod(this); }).change();
To:
$("#method").change(function () { const obj = {method: $("#method").val()}; google.script.run.addNewMethod(obj); });
- In this case, in order to run
google.script.run, please remove the focus from the textarea after you inputted values.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.