I'm trying to pass an object (contents of a sheet row) to an apps script template. You can see the row in the screenshot.
my function in apps script contains:
var sendableRows = rows.filter(function (row) { //ONLY CHECKED ROWS.
return row['Index'] == true;
});
var sendableRow = sendableRows[0];
Logger.log('sendableRow '+ JSON.stringify( sendableRow));
var html = HtmlService.createTemplateFromFile('RowPopup');
html.row = JSON.stringify(sendableRow);
var h =html.evaluate();
SpreadsheetApp.getUi() // Or DocumentApp or FormApp.
.showModalDialog(h, 'Create Documents');
The logger statement produces:
sendableRow {"Index":true,"Timestamp":"2019-02-12T21:09:14.000Z","FROM":222222,"CONVERSATION":"THIS IS A TEST","ME":"","relativeRow":14,"absoluteRow":15}
My Rowpopup.html is :
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<script>
// Prevent forms from submitting.
function preventFormSubmit() {
var forms = document.querySelectorAll('forms');
for (var i = 0; i < forms.length; i++) {
forms[i].addEventListener('submit', function(event) {
event.preventDefault();
});
}
}
window.addEventListener('load', preventFormSubmit);
function handleFormSubmit(formObject) {
// the output from form goes to processDocBuildHtml
google.script.run
.withSuccessHandler(updateUrl)
.processRowPopupHTML(formObject);
}
function updateUrl(url) {
var div = document.getElementById('output');
div.innerHTML = '<a href="' + url + '">Sent!</a>';
}
</script>
</head>
<body>
<form id="myForm" onsubmit="handleFormSubmit(this)">
<div>
<label for="optionList">Click me</label>
<select id="optionList" name="email">
<option>Loading...</option>
</select>
</div>
<br>
<div>
</div>
<br>
<div>
<textarea name="message" rows="10" cols="30">
The cat was playing in the garden.
</textarea>
</div>
<div id="textboxes"></div>
<div id="insert"></div>
<input type="submit" value="Submit" />
</form>
<div id="output">
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="//rawgithub.com/indrimuska/jquery-editable-select/master/dist/jquery-editable-select.min.js"></script>
<link href="//rawgithub.com/indrimuska/jquery-editable-select/master/dist/jquery-editable-select.min.css" rel="stylesheet">
<script>
function getConversations() {
var jsonRow = <?= row ?>; //PASSED IN JSON
console.log('row');
var myObj = JSON.parse(jsonRow);
console.log(myObj['CONVERSATION']);
return myObj['CONVERSATION'];
}
</script>
</body>
When I run this I see:
Which shows some issue with "warden".
Also, I don't see the expected data outputted to console in:
console.log('row');
var myObj = JSON.parse(jsonRow);
console.log(myObj['CONVERSATION']);
What am I doing wrong?
I know this answer is not related to this OP and the place I should post is not appropriate, but for the other people who reach this page in future, I leave an answer here because I struggled to solve similar problems.
I think this error means we cannot connect from an HTML file to the scripts written in Script Editor.
So basically you can ignore this error message(maybe. If not, tell me the correct feature.)
To me, the error has occurred when executing google.script.run.myFunction()
. So, at the first, I thought the error prevents this execution. However, the error was completely unrelated to this execution. It was another problem and I detected why my issue had happened by using withFailureHandler(onFailure)
. It emits an error message. (See more information at https://stackoverflow.com/a/33008218/3077059)
As Mr. Rubén says "So it's not you, it's Google", this error can be replayed, easily. Please don't be puzzled by this message. The error message("There was an error during the transport or processing of this request. Error code = 10, Path = /wardeninit") is useless, I think. Ruben's great post is this -> https://stackoverflow.com/a/54756933/3077059
Your client side code never calls getConversations
, that is why you don't see it on the console. Among many ways to do this, you could add an IIFE to call that function by adding the following on between <script>
tags
(function (){getConversations()}());
function myFunction(){
var html = HtmlService.createHtmlOutputFromFile('index');
SpreadsheetApp.getUi().showModalDialog(html, 'Test')
}
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
Hello world!
</body>
</html>
So it's not you, it's Google
You have only declared the function getConversations
. It's not executed until call it ()
.
To execute directly on loading, try
(function getConversations(){})()
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With