inserting HTML into pop-ups or notes in google sheets

问题

I love working with pop-ups to retrieve complementary information.

But as you can see I would like to arrange the data into some sort of table to give it a more proper look.
So the question is really simple: is there any way to insert a sort of html into setNote() in Google Apps Script or may be come up with some sort of DIY pop-up?

I am talking about the original web application of course.

回答1:

Simple Dialog

This function will put everything in Column A and B into a table in a modeless dialog. It's all in a google script.

function simpleDialog() {
  var ss=SpreadsheetApp.getActive();
  var sh=ss.getActiveSheet();
  var rg=sh.getRange(2,1,sh.getLastRow()-1,2);
  var vA=rg.getValues();
  var html='<html><head><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"><script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script></head><body>';
  html+='<style>th,td{border:1px solid black;}</style><table>';
  html+=Utilities.formatString('<tr><th>%s</th><th>%s</th></tr>',"Asset","Rate");
  vA.forEach(function(r,i){
    html+=Utilities.formatString('<tr><td>%s</td><td>%s</td></tr>',r[0],r[1]);
  });
  html+='</table><br /><input type="button" value="Exit" onClick="google.script.host.close();" />';
  html+='</body></html>';
  var userInterface=HtmlService.createHtmlOutput(html);
  SpreadsheetApp.getUi().showModelessDialog(userInterface, "Data Dialog");
}

回答2:

If you are looking to someway to show rich text on a mouse hover event over a Google Sheets cell, it's not possible by using built-in features or Google Apps Script.

Google Sheets note can only display plain-text, so in order to show content formatted by using HTML/CSS you could use a custom dialog but them are displayed when a user click a image with a script assigned, a custom menu or by something in a sidebar (a button, event, etc.)

References

https://developers.google.com/apps-script/guides/dialogs
https://developers.google.com/apps-script/guides/sheets
https://developers.google.com/apps-script/guides/triggers/events

来源：https://stackoverflow.com/questions/59343931/inserting-html-into-pop-ups-or-notes-in-google-sheets

标签

javascript

html

google-apps-script

google-sheets

popup