0
72
Visualizaçõesis it possible to receive Dom in google webscript?
I receive from google sheet some html tags to be displayed but it shows as raw string. here is how
Index.html
<? var BlogData = getSheetData("Blogs"); ?>
<? for(var i = 0; i < BlogData.length; i++) { ?>
<div class="text-muted text-end"><?= BlogData[i][1] ?></div>
<!-- BlogData[i][1] this should be dom but it displays as string -->
<?};?>
code.gs
function doGet(e) {
return HtmlService.createTemplateFromFile('Index').evaluate();
}
function getSheetData(sheetName) {
var ss= SpreadsheetApp.openById("1s5AHWsdfbsgfaegsdthwrthaert5ad4y4gt56355h");
var dataSheet = ss.getSheetByName(sheetName);
var dataRange = dataSheet.getDataRange();
var dataValues = dataRange.getValues();
return dataValues;
}
and the value comes from sheet Blogs look like this
| A | B |
|---|---|
<h1>Title </h1> |
|
<h2>Subtitle</h2> |
|
<p>Paragraph</p> |
and unfortunately it displays in the Index.html as string
I need to show it as DOM not as string
2 Respostas
Responde à pergunta0
finally, I found the solution.
using google interpolation tags is a bit tricky and I don't know types of these tags. but accidently I found that solution.
using <?= blogData[i][j] ?> will return html tags as it is.
however, <?!= blogData[i][j] ?> will return html format.
using exclamation mark completely changes the result.
0
I'll leave this as an example of what devoloper was doing:
He created a deployment so you can retrieve HTML tags from a Spreadsheet, like this:
Now the problem was that the deployment was showing results as raw texts as:
By using the HTML SCriptlets that App Script provides you can return the data from the spreadsheet by passing the values through a script. Something like this:
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<div class="root">
<? const blogData = getSheetData("Blogs");?>
<div>
<? for(var i = 0; i < blogData.length; i++) { ?>
<div>
<? for (var j = 0; j < blogData[i].length; j++) { ?>
<div>
<?!= blogData[i][j] ?> // This is the solution that devoloper found
</div>
<?};?>
</div>
<?};?>
</div>
</div>
</body>
</html>
function doGet(e) {
return HtmlService
.createTemplateFromFile("index")
.evaluate()
}
function getSheetData(sheetName) {
var ss = SpreadsheetApp.getActiveSpreadsheet();
var dataSheet = ss.getSheetByName('Blogs');
var dataRange = dataSheet.getDataRange()
var dataValues = dataRange.getValues();
console.log(dataValues)
return dataValues;
}
Once the above script is run the HTML tags added on the spreadsheet will return as a regular HTML DOM:
