Can anyone please suggest how to add two Widgets/InputTextBoxes side by side in a Google Apps Script [Gmail Add-on] ?
Sample Code:
var section = CardService.newCardSection();
section.addWidget(
CardService.newTextInput()
.setTitle("Title1")
.setFieldName("field1")
);
section.addWidget(
CardService.newTextInput()
.setTitle("Title2")
.setFieldName("title2")
);
The above Google Apps script code creates two InputText fields one below the other in Gmail Add-on.
Is there any way to create two TextInputFields/Dropdowns/Widgets in a same row? [next to each other]
Something like these:
Thanks,
Side-by-side (a.k.a. "in-line fields" in other products) can't currently be done, and will likely remain this way solely because of the width of the add-on sidebar. Google's style guide already recommends that you use a multi-line text input box if you are anticipating "more than a few words." I consider it unlikely for Google to extend their CardService implementation to add an "in-line" flag given their recommendation.
The reason for this restriction no doubt lies in the purpose of CardService:
The UI structures you build with this service are automatically available in both desktop and mobile devices, so you don't need to develop separate UIs for both.
and also stems from one of their "best practices":
If a given card has too many widgets, it can fill too much of the screen and become less useful. While large card sections render as collapsable UI elements, this hides information from the user. Aim to streamline your add-on and provide exactly what the user needs and no more.
With multiple text inputs on a single line, the display could become extremely crowded when viewing the add-on from a mobile device, even if it is still comfortable when viewed via desktop browser. Limitations on side-by-side layout are not unique to TextInputs. Other "side-by-side" widgets such as a Key-Value will not allow setting both a Button and a Switch.
Consider reviewing the available widgets on the Widget overview - images on the page detail the appearance of a wide variety of widgets and you may find something more suitable.
Alternately, consider creating a Feature Request for this functionality, or reviewing the existing Feature Requests in Google's Issue Tracker
Semi-related existing questions:
Any way to show two widget side by side in gmail add on?
How to create this UI in Gmail Add-on using Google Apps Script
Related
In Slate I have a table widget and like to read out values from cells by clicking the cell. I heard it might work using 'ClickEvent' but I have no clude how to do this :-(
Anyone has experience?
I tried nothing becuase I don't know how.
I like to read out a cell to use as a filter to filter the table.
You can find the documentation for custom ClickEvent handlers for Table and HTML widgets and how to pass values into Events through these clicks in the Slate Best Practices docs.
You can also look in the Slate reference examples on your Foundry instance and find some interactive apps to work from.
/Foundry Training and Resources/Reference Examples/Application Development in Slate/1. Tutorials/2. Tutorial - Intro to Slate Hidden Features has an example at the very bottom of a table with buttons embedded in each row that works using the custom ClickEvent framework.
There are lots of other reference examples for all kinds of Slate implementation patterns in these folders that might be relevant to explore.
I want to be able to edit the Google Calendar UI to have custom fields show up when a user is creating an event. I know it is possible to patch events and add custom fields to it after, but I want these custom fields to be defaulted on the user's calendar so anytime they create an event, the options show up. The pop-up I'm talking about is below.
I know that you can use AppScripts to create an add-on on the side of the screen, but I would prefer to have the change made right in the user's main UI. It seems like this is possible, as there is a Zoom add-on that allows you to "Make it a Zoom Meeting" as seen in the screenshot above in the bottom right hand corner.
If anyone could point me towards an example/documentation on how to do this, that would be greatly appreciated. Thanks in advance!
There is a similar question asked here
Where a community member shared a few options such as:
Using a browser extension to inject your custom fields + the Google Calendar API + the OAuth required.
Create your own UI using Google Apps Script CardService and its HTML service.
When editing a Google form manually, you can usually click on an item, and on the side appears a menu, which includes the button "import questions". This button is very useful for me as it allows me to collect questions from past Google forms and import them to new Google forms.
But I'm looking through the Forms documentation, and I can't figure out how to do this via Google apps script programatically.
Here is the documentation:
https://developers.google.com/apps-script/reference/forms/form
The closest thing to what I want is the .moveItem() method, which moves an item from one spot in a form to another. But it only works within the same form. I want to know if I could do it across forms. And ideally, instead of moving the item, it would make a copy of the item in the new form.
I considered the .getItems() method, but there doesn't seem to be a general .addItem() method I could use on the new form. Would I have to go through the painstaking process of having to identify each item type, and specify how the details of each one should be copied to the new form, including things like point values of a question and whether or not the question is required?
I want to import from forms that have all kinds of content: video, images, multiple choice questions, grid questions, number scale questions, etc. I feel that if I have to specify the details of each item type, it would take too long, and I would be bound to miss something or run into an error that may be impossible to solve. Is there not an easier way?
And if specifying each item type is what I have to do to import everything properly, has someone else created that code already that I can re-use?
Issue:
In the current stage, unfortunately, it seems that Forms Service cannot copy all items. Ref1, Ref2 Ref3. And, unfortunately, moveItem can be used for the same Google Form as you say.
Workaround:
In your situation, as a workaround, how about copying the source Google Form? And, when there are some items you want to remove, you can remove them. I thought that this process can be achieved by Google Apps Script.
But, I'm not sure about your actual Google Form. So I'm not sure whether this is a suitable method.
Future:
Recently, Google Forms API was announced. Ref When this API got to be able to be used, your goal might be able to be achieved by retrieving the object from Google Form. Unfortunately, I'm still not sure about the detail of it.
I have multiple multiple choice questions and checkboxes with images inside them. I am trying to compile all the questions into a doc file. How do I get the images inside the questions? They are not in a separate Image Item.
https://docs.google.com/forms/d/1qdqNcaaiKxOoi4IiNc_3xcr1X3uw84qnV7mqMzcQA-0/edit?usp=sharing (This is a sample form containing an Image inside the question in case it isn't clear from the text)
Answer:
Unfortunately, at the moment there is no way to get/set images in multiple choice questions using Apps Script.
Feature Request:
There is already a feature request for setting images using FormApp, which can be found at the following link:
Add an image to a Google Form item (different from ImageItem)
You should star this issue to let Google know that this is a highly requested feature so that they can prioritise feature requests.
Alternatively, create a second Feature request specifically about getting the image and link to this one. The link to flie a feature request for Apps Script is here.
This feature has been assigned and is expected to come soon. https://issuetracker.google.com/u/1/issues/135828271 star this issue for progress updates
Background: I have a Google Sheet that automatically manages key organization event dates, but occasionally one has to be manually overridden. I have been duplicating those auto calc'd event dates using PHP on the organization's web page but that doesn't handle it when the event dates are manually changed back in the Sheets database.
Need Statement: I wish to grab the text content of the Google "DateCalc" Sheet, cell "A33" (which contains the corrected next Date) and embed it automatically in a web page sentence that states, "The next event is scheduled for ???." where "???" is whatever is needed for the HTML embed effort for the text content of cell A33.
All the embedding approaches I have tried using the publish to web feature of Sheets, just display a frame with the entire Sheets page content, and I have not been able to find a simple single text display approach, which is what I seek. All the solutions I have found so far are for much more complex situations. I believe I don't need any more code on the Sheet (source) end, just an appropriate "embed code snippet" at the destination end.
I can embed a complete sheet but haven't found a way to embed a simple text string in line with the surrounding text in the sentence.
This web script is the closest I have been able to come...
Our next meeting is on <object data="https://docs.google.com/spreadsheets/d/e/2PACX-1vQq6sXBel4SOW5U_XLnQ1xyyl4P-aK2v1R-5uofUvstMLV89_yCSqX3Lmsy4B7E21gojeG88efGFjZ0/pubhtml?gid=604484136&single=true&range=A29&chrome=false" type="text/html" width="171" height="15"></object>.
but, if the Code Snippet really ran (I changed the file ID to protect the innocent), you would see it doesn't produce an in-line text string but an isolated "block" with the text inside it, as shown below....
The text seems to be an image, not text, that is displaced above the text baseline and has a small gray blob following it that I just can't get rid of.
I'll assume that your server uses a combination of PHP and HTML, so one approach can be to use that PHP code to make a call to the Sheets API to retrieve the data. In the PHP Sheets API Quickstart you can find a example of how to set up a project to achieve a working connection between your server and the API. After you complete the tutorial, you can modify your script to include the following function so you can achieve your original request.
function getNextDate() {
$client = getClient();
$sheetsService = new Google_Service_Sheets($client);
$spreadsheetID = '{YOUR SPREADSHEET ID}';
$cellRange = 'DateCalc!A33';
$serverResponse = $sheetsService->spreadsheets_values->get($spreadsheetID, $cellRange);
$cellValue = $serverResponse->getValues();
if (empty($cellValue)) {
return "NO MEETINGS AHEAD!\n";
} else {
foreach ($cellValue as $value) {
return $value[0];
}
}
}
A totally different alternative is to use a webapp. You can use this tutorial to deploy a webapp that can be later embedded in your webpage to show the following meeting dates.
So there are two free alternatives to accomplish your objectives: using the Sheets API or a webapp; and in this anwser I provided a function for the API option. Please, don't hesitate to offer information for further clarifications or request for help.
Our next meeting is on
.
I built a free, open source, and easy to use service and badge generator called https://cellshield.info. It works out of the box for public Google spreadsheets. What you see above is a live Markdown output version of a badge that is synced from a spreadsheet with the value formatted as what was shown in your example with a formula of TODAY(). The Markdown just makes an image tag which I suppose you can do with anything else that can make an image tag as well.
If you want the yellow or any formatting to to go away, try this:
Our next meeting is on
.
This was done by adding &color=rgba%28255%2C255%2C255%2C0.0%29&style=flat-square to the arguments. The text doesn't match perfectly, it's servicable.
Anyway, I see you went with tabletop but if you or anyone else is just looking to do what you wanted to do, then my service should be sufficient.
For example, it is used for this Game Boy development contest to present the prize pool amount.
If a private spreadsheet solution is needed, one could fork my code, run it on Cloud Run in their Google Cloud Platform account and explicitly share the spreadsheet to the service account on their Google Cloud Platform instance.
Jacques-
Merci beaucoup !
It has been a challenging several days of non-stop effort but you put me on the right track.
Using less than 20 lines of JavaScript code, including one line for the free TableTop.js library call (see https://github.com/jsoma/tabletop#if-your-publish-to-web-url-doesnt-work) and inserting a string in the middle of my HTML sentence, yielded EXACTLY what I was seeking and the solution was INFINITELY SIMPLIER than virtually everything else I found that required multiple libraries, subscription fees, complex system calls, etc.
The hardest part was inserting the JavaScript code into WordPress which my web site is constructed with, as you can essentially only insert plain text into a WordPress page, but with the an added WordPress plugin (Insert Header and Footers) you can put code into a WordPress page.
Many thanks for getting me headed in the right direction, and having a great learning experience along the way. :-)