invitation india
Create custom dialog box or Html Popup in google app scripts
Google App Script allow HTML Service to Create web pages (HTML Interface) that can interact with server-side Apps Script functions. So yoy can create custom user interfaces in Google Docs, Sheets, and Forms.
1. Create HTML files
To add an HTML file to your Apps Script project, open the Script Editor and choose File > New > Html File.
2. Create HTML template/Interface
Learn More :
CODE.GS (add Google Script function)
function showDialog() { var html = HtmlService.createHtmlOutputFromFile('Htmlfilename') .setWidth(400) .setHeight(300); SpreadsheetApp.getUi() // Or DocumentApp or FormApp. .showModalDialog(html, 'My custom dialog'); }
Htmlfilename.html (add Google Script function)
<!DOCTYPE html>
<html>
<head>
<style>
div.polaroid {
width: 250px;
box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
text-align: center;
}
div.container {
padding: 10px;
}
</style>
</head>
<body>
<div class="polaroid">
<img src="https://www.w3schools.com/css/rock600x400.jpg" alt="Norway" style="width:100%">
<div class="container">
<p>Hardanger, Norway</p>
</div>
</div>
</body>
</html>
How To Call Google App Script Funtion with HTML Interface
Are you want to calling a function in the Google script from your custom HTML dialogbox or popup.
Learn more:
In Google Script:
function doGet() { return HtmlService.createHtmlOutputFromFile('Index'); } function doSomething() { Logger.log('I was called!'); }
In Html File:
<!DOCTYPE html> <html> <head> <base target="_top"> <script> google.script.run.doSomething(); </script> </head> </html>