Search code examples
javascriptjsongoogle-sheetsgoogle-apps-scriptweb-applications

Passing Google Script Value in JavaScript and JSON

I have a code that looks like this.

code.gs

function doGet(e) {

  var t = HtmlService.createTemplateFromFile('Index');
  var matgrp = e.parameter.matgrp;
  t.dataFromServerTemplate = {first: matgrp};

  t.data = SpreadsheetApp
      .openById('1231455566776fgfgggggggg')
      .getActiveSheet()
      .getDataRange()
      .getValues();

  return t.evaluate();

}

Please focus on this part.

var matgrp = e.parameter.matgrp; t.dataFromServerTemplate = {first: matgrp};

and here is index.html

<!DOCTYPE html>

<script>
    var data = <?!= JSON.stringify(dataFromServerTemplate) ?>; //Stores the data directly in the javascript code

    function initialize() {
        document.getElementById("myTitle").innerText = data.first;

    }

    window.onload = initialize;
</script>


<html>
<head>
<base target="_top">

<style>
table,th,td
{
border:1px solid #ddd; font-family:tahoma;font-size: 10px
}
</style>


</head>




<body>

 <H2 id="myTitle"></H2>

<table cellspacing="0" cellpadding="3"  height ="100%" width ="60%" align = "center">
   <th>Item Code</th>
   <th>Product Name</th>
   <th>Main Description</th>
   <th>Other Description</th>

        <? for (var i = 2; i < data.length; i++) { ?>
        <tr>
        <? if(data[i][13] == "Wall Fan") {?>
        <td><?= data[i][1] ?></td>
        <td><?= data[i][2] ?></td>
     <td><?= data[i][3] ?></td>
     <td><?= data[i][4] ?></td>
     <? }else{ ?>     
     <?}?>
     <? } ?>


     </tr>
</table>

</body>
</html>

as what you see on the code above the function initialize gets the data from code.gs and display it in header. the <H2 id="myTitle"></H2> my question is how can i pass the value in this line of code?

<table cellspacing="0" cellpadding="3"  height ="100%" width ="60%" align = "center">
   <th>Item Code</th>
   <th>Product Name</th>
   <th>Main Description</th>
   <th>Other Description</th>

        <? for (var i = 2; i < data.length; i++) { ?>
        <tr>
        <? if(data[i][13] == "This is where I need to put the data") {?>
        <td><?= data[i][1] ?></td>
        <td><?= data[i][2] ?></td>
     <td><?= data[i][3] ?></td>
     <td><?= data[i][4] ?></td>
     <? }else{ ?>     
     <?}?>
     <? } ?>


     </tr>
</table>

this is my last problem and I dont know how to pass. the reason why im doing this is to use that value to create a table based on condition.

TYSM for help

Solution

  • Change 

    <? if(data[i][13] == "This is where I need to put the data") {?>

    to 

    <? if(data[i][13] == dataFromServerTemplate.first) {?>