CODEWITHSUNDEEP
javascripthtmlgoogle-apps-script
DigitalMass
DigitalMass

Reputation: 1

Printing Spreadsheet details to HTML

I have created a project on Google Apps Script and have the tutorial script on it however it is not working. Basically I want the HTML to print the data from the data-range on the Google Spreadsheet.

The code for my .gs file is:

function doGet() {
  return HtmlService.createHtmlOutputFromFile('Main Page');
}

function getData() {
  return SpreadsheetApp.openById('0AtD2IyQN1tyGdHBiLWExb3NoSHZ2RlAzNTBrS1dQLXc').getRangeByName('dataRange').getValues();
}

and the code for my html is:

<html>
 <? var data = getData(); ?>
</html>

I am fairly new to the Google Apps Script applications and have looked at this code a number of times. The app I have created seems to not be working at all. Can anyone provide a solution for me or explain why this is not working?

Upvotes: 0

Views: 825

Answers (1)

Serge insas
Serge insas

Reputation: 46794

I'm afraid a couple of things are wrong in your code :

  1. You should use return HtmlService.createTemplateFromFile('Main Page').evaluate(); to get the result of an html page with code
  2. The value returned by getData is an array, you should convert it one way or another to something that can be understood by HTML...or have some code in the html file to handle the array data correctly.

For example, a string is working

function getData() {
  var data = SpreadsheetApp.openById('0AtD2IyQN1tyGdHBiLWExb3NoSHZ2RlAzNTBrS1dQLXc').getRange('testRange').getValues();
  return data.toString().replace(/,/g,'  |  ');
}

3: the syntax in your html is wrong, try it like this :

<html>
 <?= getData(); ?>
</html>

or like this, each cell on a new line if data is a simple array :

(in code use return data.toString().split(',');)

<? var data = getData();
  for (var i = 0; i < data.length; ++i) { ?>
  <b><?= data[i] ?></b><BR>
<? } ?>

Or in a table if you keep your data as a 2 dimensions array, here is a full example :

test exec here

code :

function doGet() {
  return HtmlService.createTemplateFromFile('Main Page').evaluate();
}

function getData() {
  var data = SpreadsheetApp.openById('0AtD2IyQN1tyGdHBiLWExb3NoSHZ2RlAzNTBrS1dQLXc').getRange('dataRange').getValues();
  return data;
}

HTML :

<table border="5" bordercolor="FFCC00" style="background-color:#dddddd" width="400" cellpadding="5" cellspacing="3">    
<? var data = getData();
  for (var i = 0; i < data.length; ++i) { ?>
  <tr>
<?   for (n = 0; n< data[0].length; ++n) { ?>
  <td><?= data[i][n] ?></td>
<? } }?>
</tr>
</table>

I think that's all... I don't know what is in your range to show so I can't go further with more tips...

Upvotes: 1

Related Questions