如何将电子表格数据导入客户端阵列到HTML服务(Google App脚本)

时间:2013-05-09 03:34:12

标签: javascript jquery html arrays google-apps-script

我正在使用GAS HTMLService来设计一个Web应用程序并遇到了一个我无法克服的主要障碍 - 所以我希望能从你们那里得到一些帮助。

我可以使用标准的doGet创建模板并正确显示HTML:

function doGet(e){
var ss = SpreadsheetApp.openById('SpreadSheetKey');
var usersheet = ss.getSheetByName('UserInfo');
var lastRow = usersheet.getLastRow();
var Userrange = usersheet.getRange(2, 1, lastRow-1, 4);
var Uservalues = Userrange.getValues();
var length = Uservalues.length;

var template = HtmlService.createTemplateFromFile('Form.html');
template.stuff = {};
template.stuff = Uservalues;

template.action = ScriptApp.getService().getUrl();

return template.evaluate();
}

只要我从HTML文件中删除这段代码,HTML就会正常呈现:

  $('#chkP').click(function(){
var email = '<?=email?>';
var usename = $('#myuserName').val();

for(var i=0;i<num;i++){
var name = '<?!=stuff[i][0]?>';
alert(name);
}    
});

该问题似乎与尝试使用'i'变量有关 - 我可以使用以下方式获取正确的信息:

'<?=stuff[2][0]?>' // THIS WORKS

<?=stuff[i][0]?> //THIS DOES NOT -- IT IS ALWAYS undefined 
// it's like 'i' and <?stuff?> aren't in the same scope??

所以我的理论是我有一个ServerSide数组:

 (Spreadsheetapp.blahblah.getValues();) 

无法供客户端使用。

我的问题是,如何将这些数据从电子表格中提取到HTML表单中,并可以使用简单的“for”循环作为数组进行迭代....

或者有更好的方法吗?

1 个答案:

答案 0 :(得分:5)

数组在服务器上是正确的。 <? .. ?>中的任何代码都是服务器代码,在客户端上不可用。

您可以做的是将整个数组复制到客户端,以便稍后可以迭代它:

假设您在服务器上有一个数组:

<? var serverStuff = [1, 2, 3]; ?>

您可以告诉模板将其复制到客户端(基本上,将其值直接写入客户端代码。

<script>
    ...
    var clientStuff = <?!= JSON.stringify(serverStuff) ?>;
    ...

    // Now you have it on the client! You can use it here:
    alert(clientStuff[0]);
</script>

您可以通过在服务器上记录模板内容(评估后)来查看发生的情况:

Logger.log(template.evaluate().getContent());

这将为您提供这个实际的客户端代码,并将数组的副本写入其中:

<script>
    ...
    var clientStuff = [1, 2, 3];
    ...

    // Now you have it on the client! You can use it here:
    alert(clientStuff[0]);
</script>