AI-generated Key Takeaways
-
TextInput is an input field widget for accepting text input.
-
It supports form submission validation to ensure a value is entered when required.
-
TextInput is available for use in Google Workspace add-ons and Google Chat apps.
-
Various methods are available to configure the TextInput widget, such as setting the field name, title, hint, and handling changes or suggestions.
A input field widget that accepts text input.
Supports form submission validation. When Action.setAllWidgetsAreRequired(allWidgetsAreRequired) is set to
true or this widget is specified through Action.addRequiredWidget(requiredWidget), the submission
action is blocked unless a value is entered.
Available for Google Workspace add-ons and Google Chat apps.
const textInput = CardService.newTextInput() .setFieldName('text_input_form_input_key') .setTitle('Text input title') .setHint('Text input hint');
Methods
| Method | Return type | Brief description |
|---|---|---|
set | Text | Sets the key that identifies this text input in the event object that is generated when there is a UI interaction. |
set | Text | Sets a hint for the text input. |
set | Text | Sets a data source from Google Workspace applications. |
set | Text | Sets whether the input text shows on one line or multiple lines. |
set | Text | Sets an action to be performed whenever the text input changes. |
set | Text | Sets the suggestions for autocompletion in the text field. |
set | Text | Sets the callback action to fetch suggestions based on user input for autocompletion. |
set | Text | Sets the title to be shown above the input field. |
set | Text | Sets the validation rule for this widget. |
set | Text | Sets the pre-filled value to be set in the input field. |
Detailed documentation
setFieldName(fieldName)
Sets the key that identifies this text input in the event object that is generated when there is a UI interaction. Not visible to the user. Required, must be unique.
Parameters
| Name | Type | Description |
|---|---|---|
field | String | The key that is used to identify this input. |
Return
Text — This object, for chaining.
setHint(hint)
Sets a hint for the text input. Used to give the user extra guidance on what to input. For example, a hint could describe formatting ("xxx-xxx-xxxx") for a phone number field.
Parameters
| Name | Type | Description |
|---|---|---|
hint | String | The text hint to display below the input field. This text is always visible. |
Return
Text — This object, for chaining.
setHostAppDataSource(hostAppDataSource)
Sets a data source from Google Workspace applications. Currently supports users and Chat spaces.
Only available through the Gemini Alpha program for Google Workspace add-ons that extend Google Workspace Flows.
const workflowDataSource = CardService.newWorkflowDataSource().setIncludeVariables(true); const hostAppDataSource = CardService.newHostAppDataSource().setWorkflowDataSource(workflowDataSource); const textInput = CardService.newTextInput() .setFieldName('text_input_form_input_key') .setTitle('Text input title') .setHint('Text input hint') .setHostAppDataSource(hostAppDataSource);
Parameters
| Name | Type | Description |
|---|---|---|
host | Host | The data source. |
Return
Text — This object, for chaining.
setMultiline(multiline)
Sets whether the input text shows on one line or multiple lines.
Parameters
| Name | Type | Description |
|---|---|---|
multiline | Boolean | The multiline setting. |
Return
Text — This object, for chaining.
setOnChangeAction(action)
setSuggestions(suggestions)
Sets the suggestions for autocompletion in the text field.
Parameters
| Name | Type | Description |
|---|---|---|
suggestions | Suggestions | The collection of suggestions to use. |
Return
Text — This object, for chaining.
setSuggestionsAction(suggestionsAction)
Sets the callback action to fetch suggestions based on user input for autocompletion. The
Action parameter must specify a callback function that returns a Suggestions object.
const action = CardService.newAction() .setFunctionName('suggestionCallback') .setParameters({numSuggestions: 3}); CardService.newTextInput() .setFieldName('option-field') .setTitle('Option Selected') .setSuggestionsAction(action); // ... function suggestionCallback(e) { const suggestions = CardService.newSuggestions(); const numSuggestions = Number.parseInt(e.parameter.numSuggestions); for (let i = 1; i <= numSuggestions; i++) { suggestions.addSuggestion(`Suggestion ${i}`); } return CardService.newSuggestionsResponseBuilder() .setSuggestions(suggestions) .build(); }
Parameters
| Name | Type | Description |
|---|---|---|
suggestions | Action | The action that fetches suggestions for this input. |
Return
Text — This object, for chaining.
setTitle(title)
Sets the title to be shown above the input field. Required.
Parameters
| Name | Type | Description |
|---|---|---|
title | String | The text label for this input. |
Return
Text — This object, for chaining.
setValidation(validation)
Sets the validation rule for this widget.
const validation = CardService.newValidation().setCharacterLimit('10').setType( CardService.InputType.TEXT); const input = CardService.newTextInput() .setFieldName('text_name_xxx1') .setTitle('Max 10 characters') .setValidation(validation);
Parameters
| Name | Type | Description |
|---|---|---|
validation | Validation | The validation rule for this Text widget. |
Return
Text — This object, for chaining.
setValue(value)
Sets the pre-filled value to be set in the input field.
Parameters
| Name | Type | Description |
|---|---|---|
value | String | The default value placed in the input. It is always represented as a string in the form callback parameters. |
Return
Text — This object, for chaining.