In Google Apps Script - I set the title using the doGet as below.
Google Apps script .gs
function doGet(e) {
return HtmlService.createHtmlOutputFromFile('BFform.html')
.setTitle("This is MYTITLE");
}
function ChangeTitle() {
var Changed = HtmlService.createHtmlOutputFromFile('BFform.html');
Changed.setTitle("New Title");
}
I now need to change the title when a button is clicked
On the HTML file on click of a button I have as below
function CallChangeTitle(){
google.script.run.ChangeTitle();
}
However the Title is not changing
You can do it using the method setTitle(String). The linked documentation describes its usage.
The Apps Script web app is rendered inside an IFRAME. For security reasons, you cannot access or change the title of the parent window from an iframe which is located on another server.
Related
Background
I have a Google spreadsheet that contains multiple chart sheets.
I want to publish the entire spreadsheet and embed it in an HTML page (plain single HTML page. no other files.)
I have this simple HTML embedding simple published Google spreadsheet.
<iframe height="400px" scrolling="no" src="https://docs.google.com/spreadsheets/d/e/2PACX-1vSE-4lufoePc8SMq1r5o9K_uWE7Km9JiouogYBUJHVBo8Esnf4tImqdNUiCcWu_26AzwDUZCM_wS1Vs/pubhtml?widget=true&headers=false" width="100%"></iframe>
Problem
I want to disable the tooltip-no-hover feature when the cursor is on some area of the chart (specifically one the bar itself).As a matter of fact, I want to disable any user interaction with the chart.
However, the user still needs to be able to navigate between the sheets.
Failed attempts
I'm new in this area so likely my attempts/coding is senseless.
<iframe enableInteractivity="False" ...
<iframe style="pointer-events: none;... - did not allow to navigate between sheets.
Unfortunately, what you want cannot be achieved.
According to the Charts Service documentation:
If you want to render charts in a web browser, use the Google Charts API instead.
The Google Charts Visualization API, however, allows you to modify the tooltip. But in order to do this, you will have to create the chart programmatically.
For this, you can try the example presented in the Quickstart here.
So after modifying the options parameter to this:
var options = {'title':'How Much Pizza I Ate Last Night',
'width':400,
'height':300,
'tooltip': { 'trigger': 'selection' }};
This is how the chart will look like when hovering over the Mushroom part:
You can include the code from the Quickstart mentioned above in an HTML file in Apps Script in order to create a web app. The only missing part is the doGet function, which can look something like this:
function doGet() {
var htmlOutput = HtmlService.createHtmlOutputFromFile('QUICKSTART_HTML_FILE');
return htmlOutput;
}
Reference
Google Charts Quick Start;
Google Charts Tooltips;
Apps Script Web Apps.
I have a google doc that I show inside an iframe in my website for public editing, it contains linked charts from a public spreadsheet,
I change the chart data with spreadsheet api, but the chart in the doc does not refresh automatically, and I can't clic update or update all in the doc because the "update button" is disabled,
SO I wanted to use google docs api or apps script to refresh charts,
I did not find how to do it with google docs api, and apps script does not trigger inside the iframe,
Can you please give me any idea how to do this,
Thank you.
Unfortunately there is no way to refresh charts programatically in a Google Document. You should definitely submit a feature request for SheetsChart support as there is in Google Slide App Script Service.
Workaround with Slides
Since the update feature is currently available for Slides you could achieve to style a Slide as a document and use it in your iFrame. Following this update logic you will be able to trigger a SheetsChart refresh every minute for example:
function myFunction() {
ScriptApp.newTrigger('updateCharts').timeBased().everyMinutes(1).create();
}
function updateCharts() {
let slides = SlidesApp.getActivePresentation().getSlides();
slides.forEach(slide => {
let charts = slide.getSheetsCharts();
charts.forEach(chart=> chart.refresh());
});
}
Workaround with Documents
However, since your goal is to provide your website viewers with the last version of the iFrame this can be done automatically on Document save:
File > Publish on the Web > check Automatically republish when changes are made
You will have to update manually the chart in your Document though. But this change will be reflected in your webpage automatically.
on google sites i have a search page and i need to insert a button to export to a spreadsheet the search. The script creates a spreadsheet with the information and provides a download link.
How can I do this without reloading the search page?
is it possible to open a modal or a window over the page to display the link?
how can I fill in the doGet() event argument from the search page?
In another implementation, I had a problem with the sandbox, saying that downloading was disabled in chrome since update 83. is there any way to solve this?
Or if anyone has another solution for all of that, it would be most welcome. I appreciate the collaboration.
my code.gs:
function doGet(e)
{
var report = e.parameter.report; //// how to fill a 'parameter' in search.html ?
if(report)
{
var planilha = SpreadsheetApp.create('asd');
// fill the Spreadsheet
var ssID = planilha.getId();
var URL = 'https://docs.google.com/spreadsheets/d/'+ssID+'/export?format=xlsx';
return ?? /// returns what exactly?
}
return HtmlService.createTemplateFromFile('search').evaluate();
}
There is already a reported issue on Public Issue Tracker to to add "allow-downloads" in HtmlService.XFrameOptionsMode.ALLOWALL
You can go there and click on the star besides the issue title so it gets more visibility.
How to show the Load Indicator while running the google app script
If you want to stop the interaction with the sheets while the image is showing and the is executing you could try to use the UI method showModalDialog().
So something like this would do the trick for what you are trying to achieve:
function showDialog() {
var ui = SpreadsheetApp.getUi();
// Display a modal dialog box with custom HtmlService content.
var htmlOutput = HtmlService
.createHtmlOutput('<img src=https://i.stack.imgur.com/AuqJU.gif>')
.setWidth(250)
.setHeight(300);
ui.showModalDialog(htmlOutput, 'Script Running');
}
If you want to have more control over the closing of the dialog you will need to do it from the client side. Modifying the HTML object inside the showModalDialog(). In case you are interested in that I would suggest to take a look into this question.
You can also check the Apps Script documentation about dialogs and other UI elements.
I am not sure if what I am trying to do is even possible.
I am trying to put a google form into the sidebar of a google doc.
Right now I have an apps script document plugin that opens the sidebar fine, and I am able to open the form using var form = FormApp.openById('form_id');
But I don't know how to get a html object or blob from a form element that I could use to embed the form in the sidebar.
I also can't use iframes as those are disallowed.
While you can display a google form in a sidebar in a spreadsheet/document (see sample code below), there is one significant gotcha with it: the form does not work, i.e. you can't submit the form. Not sure exactly why, but my guess it is due to the sandbox restrictions and/or caja sanitization.
I suggest you code your own form using HTML and HTML Service (or UI Service) and show that in a sidebar. If you need you form to save the responses to a spreadsheet, you can also do that rather easily. See this for more on info and code samples of using forms in HTML Service and this for using forms in UI Service. Your server-side script can open a spreadsheet and write form values to it, if that's what you need to do.
Sample code for an Add-on to show Google Form in a Sidebar in Google Sheet:
NOTE: The form does not actually work - it does not submit when shown in a sidebar!
function showFormInSidebar() {
var form = FormApp.openById('YOUR-FORM-ID-HERE');
var formContent = UrlFetchApp.fetch(form.getPublishedUrl()).getContentText();
var ui = HtmlService.createHtmlOutput(formContent).setTitle("Google Form in Sidebar Example");
SpreadsheetApp.getUi().showSidebar(ui);
};
function onOpen(e) {
// Add this add-on to Add-ons menu
SpreadsheetApp.getUi().createAddonMenu()
.addItem('Show form', 'showFormInSidebar')
.addToUi();
};