Passing an array to client side function using Google apps script?
Question
HTML
<html>
<table>
<tr>
<select id="Ultra" onchange="getForm()">
<option value="0.0">1</option>
<option value="1.0">2</option>
<option value="2.0">3</option>
<option value="3.0">4</option>
</select>
</tr>
<tr>
<td id="demo">
<script>
function getForm()
{
google.script.run.withSuccessHandler(myFunction).myFuncti();
}
function myFunction(arry)
{
var x = document.getElementById("Ultra").value;
for(i=0;i<arry.length;++i)
{
if(arry[i][0] == x)
{
var a = arry[i][1];
}
document.getElementById("demo").innerHTML = a;
}
}
</script>
</td>
</tr>
</table>
</html>
I have created a Drop down menu using select , after that I was calling client side function getForm() . In that function I was calling server side function myFuncti() using google.script.run class and this will return an array which I was passing to a client side function myfunction() as an parameter.
If use Logger.log() , the server side function is returning array values successfully !!
It's an 2D array .. Am I passing it in right way to myFunction() ?
If you couldn't understand anything in the question please add a comment I will reply
2 answers
solution1
2 ACCPTED 2015-03-05 09:01:46
This is what the code needs to look like, note the use of console.log() to debug on the client side (CTRL-SHFT-I usually opens the developers console window in the browser):
index.html
<div>
<select id="Ultra" onchange="getForm()">
<option value="1.0">1</option>
<option value="2.0">2</option>
<option value="3.0">3</option>
<option value="4.0">4</option>
</select>
<p id="demo"></p>
</div>
<script>
function getForm() {
google.script.run.withSuccessHandler(myFunction).myFuncti();
}
function myFunction(arry) {
var x = document.getElementById("Ultra").value;
var y = parseInt(x, 10);
var i = 0;
var a;
console.log('x (string) = ' + x);
console.log('y (number) = ' + y);
console.log(arry);
for (; i < arry.length; i++) {
a = arry[i];
console.log('a = ' + a);
if (a === y) {
console.log('a === y');
document.getElementById("demo").innerHTML = a;
}
}
}
</script>
code.gs
function doGet(form) {
return HtmlService
.createHtmlOutputFromFile('index');
}
function myFuncti() {
return [1, 2, 3, 4];
}
Here's a working demo , and the script .
solution2
0 2015-03-03 18:38:09
According to the documentation you can simply return the Array from your Server Side function and use in your client side Javascript directly as you are doing.
Relevant documentation: https://developers.google.com/apps-script/guides/html/communication#parameters_and_return_values
Debug your client-side Javascript with the Developer Tools of your browser.
Some guesses:
Your problem is likely to do with the way you are accessing the array on the Client side, perhaps if(arry[i][0] == x) is never matching, or your reference to index 1 instead of 0 is incorrect on line var a = arry[i][1];
Also you are declaring variable "a" within the braces of the if, but then assigning it outside those braces, perhaps you mean:
for(i=0;i<arry.length;++i)
{
if(arry[i][0] == x)
{
var a = arry[i][1];
document.getElementById("demo").innerHTML = a;
}
}
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.