Class SelectionInput

    Selection Input

    An input field that allows choosing between a set of predefined options.

    Supports form submission validation for Selection Input Type.DROP_DOWN and Selection Input Type.MULTI_SELECT menus only. 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 selected.

    Available for Google Workspace add-ons and Google Chat apps.

     const 
  
 checkboxGroup 
  
 = 
  
 CardService 
 . 
 newSelectionInput 
 () 
  
 . 
 setType 
 ( 
 CardService 
 . 
 SelectionInputType 
 . 
 CHECK_BOX 
 ) 
  
 . 
 setTitle 
 ( 
 'A group of checkboxes. Multiple selections are allowed.' 
 ) 
  
 . 
 setFieldName 
 ( 
 'checkbox_field' 
 ) 
  
 . 
 addItem 
 ( 
 'checkbox one title' 
 , 
  
 'checkbox_one_value' 
 , 
  
 false 
 ) 
  
 . 
 addItem 
 ( 
 'checkbox two title' 
 , 
  
 'checkbox_two_value' 
 , 
  
 true 
 ) 
  
 . 
 addItem 
 ( 
 'checkbox three title' 
 , 
  
 'checkbox_three_value' 
 , 
  
 true 
 ) 
  
 . 
 setOnChangeAction 
 ( 
  
 CardService 
 . 
 newAction 
 (). 
 setFunctionName 
 ( 
 'handleCheckboxChange' 
 ), 
  
 ); 
 const 
  
 radioGroup 
  
 = 
  
 CardService 
 . 
 newSelectionInput 
 () 
  
 . 
 setType 
 ( 
 CardService 
 . 
 SelectionInputType 
 . 
 RADIO_BUTTON 
 ) 
  
 . 
 setTitle 
 ( 
  
 'A group of radio buttons. Only a single selection is allowed.' 
 ) 
  
 . 
 setFieldName 
 ( 
 'checkbox_field' 
 ) 
  
 . 
 addItem 
 ( 
 'radio button one title' 
 , 
  
 'radio_one_value' 
 , 
  
 true 
 ) 
  
 . 
 addItem 
 ( 
 'radio button two title' 
 , 
  
 'radio_two_value' 
 , 
  
 false 
 ) 
  
 . 
 addItem 
 ( 
 'radio button three title' 
 , 
  
 'radio_three_value' 
 , 
  
 false 
 ); 
 const 
  
 multiSelect 
  
 = 
  
 CardService 
 . 
 newSelectionInput 
 () 
  
 . 
 setType 
 ( 
 CardService 
 . 
 SelectionInputType 
 . 
 MULTI_SELECT 
 ) 
  
 . 
 setFieldName 
 ( 
 'multiselect' 
 ) 
  
 . 
 setTitle 
 ( 
 'A multi select input example.' 
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 1' 
 , 
  
 'contact-1' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact one description' 
 , 
  
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 2' 
 , 
  
 'contact-2' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact two description' 
 , 
  
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 3' 
 , 
  
 'contact-3' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact three description' 
 , 
  
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 4' 
 , 
  
 'contact-4' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact four description' 
 , 
  
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 5' 
 , 
  
 'contact-5' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact five description' 
 , 
  
 ) 
  
 . 
 setMultiSelectMaxSelectedItems 
 ( 
 3 
 ) 
  
 . 
 setMultiSelectMinQueryLength 
 ( 
 1 
 );

    Methods

    Method Return type Brief description
    add Item(text, value, selected)
    		Selection Input Adds a new item that can be selected.
    add Multi Select Item(text, value, selected, startIconUri, bottomText)
    		Selection Input Adds a new item that can be selected, for multi-select menus.
    set External Data Source(action)
    		Selection Input Sets external data source, such as a relational data base.
    set Field Name(fieldName)
    		Selection Input Sets the key that identifies this selection input in the event object that is generated when there is a UI interaction.
    set Multi Select Max Selected Items(maxSelectedItems)
    		Selection Input Sets the maximum number of items that a user can select.
    set Multi Select Min Query Length(queryLength)
    		Selection Input Sets the number of text characters that a user inputs before the app queries autocomplete and displays suggested items on the card.
    set On Change Action(action)
    		Selection Input Sets an Action to be performed whenever the selection input changes.
    set Platform Data Source(platformDataSource)
    		Selection Input Sets a data source from Google Workspace.
    set Title(title)
    		Selection Input Sets the title to be shown ahead of the input field.
    set Type(type)
    		Selection Input Sets the type of this input.

    Detailed documentation

    add Item(text, value, selected)

    Adds a new item that can be selected.

    Parameters

    Name Type Description
    text
    		Object The text to be shown for this item. Non-string primitive arguments are converted to strings automatically.
    value
    		Object The form input value that is sent via the callback. Non-string primitive arguments are converted to strings automatically.
    selected
    		Boolean Whether the item is selected by default. If the selection input only accepts one value (such as for radio buttons or a dropdown menu), only set this field for one item.

    Return

    Selection Input — This object, for chaining.

    add Multi Select Item(text, value, selected, startIconUri, bottomText)

    Adds a new item that can be selected, for multi-select menus.

     const 
  
 multiSelect 
  
 = 
  
 CardService 
 . 
 newSelectionInput 
 () 
  
 . 
 setType 
 ( 
 CardService 
 . 
 SelectionInputType 
 . 
 MULTI_SELECT 
 ) 
  
 . 
 setFieldName 
 ( 
 'multiselect' 
 ) 
  
 . 
 setTitle 
 ( 
 'A multi select input example.' 
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 1' 
 , 
  
 'contact-1' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact one description' 
 , 
  
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 2' 
 , 
  
 'contact-2' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact two description' 
 , 
  
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 3' 
 , 
  
 'contact-3' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact three description' 
 , 
  
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 4' 
 , 
  
 'contact-4' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact four description' 
 , 
  
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 5' 
 , 
  
 'contact-5' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact five description' 
 , 
  
 );

    Parameters

    Name Type Description
    text
    		Object The text to be shown for this item. Non-string primitive arguments are converted to strings automatically.
    value
    		Object The form input value that is sent via the callback. Non-string primitive arguments are converted to strings automatically.
    selected
    		Boolean Whether the item is selected by default. If the selection input only accepts one value (such as for radio buttons or a dropdown menu), only set this field for one item.
    start Icon Uri
    		Object For multiselect menus, the URL for the icon displayed next to the item's text field. Supports PNG and JPEG files.
    bottom Text
    		Object For multiselect menus, a text description or label that's displayed below the item's text field.

    Return

    Selection Input — This object, for chaining.

    set External Data Source(action)

    Sets external data source, such as a relational data base.

     const 
  
 multiSelect 
  
 = 
  
 CardService 
 . 
 newSelectionInput 
 () 
  
 . 
 setType 
 ( 
 CardService 
 . 
 SelectionInputType 
 . 
 MULTI_SELECT 
 ) 
  
 . 
 setFieldName 
 ( 
 'contacts' 
 ) 
  
 . 
 setTitle 
 ( 
 'Selected contacts' 
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 3' 
 , 
  
 'contact-3' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact three description' 
 , 
  
 ) 
  
 . 
 setMultiSelectMaxSelectedItems 
 ( 
 5 
 ) 
  
 . 
 setMultiSelectMinQueryLength 
 ( 
 2 
 ) 
  
 . 
 setExternalDataSource 
 ( 
  
 CardService 
 . 
 newAction 
 (). 
 setFunctionName 
 ( 
 'getContacts' 
 ), 
  
 );

    Parameters

    Name Type Description
    action
    		Action The external data source.

    Return

    Selection Input — This object, for chaining.

    set Field Name(fieldName)

    Sets the key that identifies this selection 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 Name
    		String The name to assign to this input.

    Return

    Selection Input — This object, for chaining.

    set Multi Select Max Selected Items(maxSelectedItems)

    Sets the maximum number of items that a user can select.

     const 
  
 multiSelect 
  
 = 
  
 CardService 
 . 
 newSelectionInput 
 () 
  
 . 
 setType 
 ( 
 CardService 
 . 
 SelectionInputType 
 . 
 MULTI_SELECT 
 ) 
  
 . 
 setFieldName 
 ( 
 'multiselect' 
 ) 
  
 . 
 setTitle 
 ( 
 'A multi select input example.' 
 ) 
  
 . 
 setMultiSelectMaxSelectedItems 
 ( 
 3 
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 1' 
 , 
  
 'contact-1' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact one description' 
 , 
  
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 2' 
 , 
  
 'contact-2' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact two description' 
 , 
  
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 3' 
 , 
  
 'contact-3' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact three description' 
 , 
  
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 4' 
 , 
  
 'contact-4' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact four description' 
 , 
  
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 5' 
 , 
  
 'contact-5' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact five description' 
 , 
  
 );

    Parameters

    Name Type Description
    max Selected Items
    		Integer The maximum number of items.

    Return

    Selection Input — This object, for chaining.

    set Multi Select Min Query Length(queryLength)

    Sets the number of text characters that a user inputs before the app queries autocomplete and displays suggested items on the card.

     const 
  
 multiSelect 
  
 = 
  
 CardService 
 . 
 newSelectionInput 
 () 
  
 . 
 setType 
 ( 
 CardService 
 . 
 SelectionInputType 
 . 
 MULTI_SELECT 
 ) 
  
 . 
 setFieldName 
 ( 
 'multiselect' 
 ) 
  
 . 
 setTitle 
 ( 
 'A multi select input example.' 
 ) 
  
 . 
 setMultiSelectMinQueryLength 
 ( 
 1 
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 1' 
 , 
  
 'contact-1' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact one description' 
 , 
  
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 2' 
 , 
  
 'contact-2' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact two description' 
 , 
  
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 3' 
 , 
  
 'contact-3' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact three description' 
 , 
  
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 4' 
 , 
  
 'contact-4' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact four description' 
 , 
  
 ) 
  
 . 
 addMultiSelectItem 
 ( 
  
 'Contact 5' 
 , 
  
 'contact-5' 
 , 
  
 false 
 , 
  
 'https://www.gstatic.com/images/branding/product/2x/contacts_48dp.png' 
 , 
  
 'Contact five description' 
 , 
  
 );

    Parameters

    Name Type Description
    query Length
    		Integer The number of text characters.

    Return

    Selection Input — This object, for chaining.

    set On Change Action(action)

    Sets an Action to be performed whenever the selection input changes.

    Parameters

    Name Type Description
    action
    		Action The action to take.

    Return

    Selection Input — This object, for chaining.

    set Platform Data Source(platformDataSource)

    Sets a data source from Google Workspace. Used to populate items in a multiselect menu.

     const 
  
 multiSelect 
  
 = 
  
 CardService 
 . 
 newSelectionInput 
 () 
  
 . 
 setType 
 ( 
 CardService 
 . 
 SelectionInputType 
 . 
 MULTI_SELECT 
 ) 
  
 . 
 setFieldName 
 ( 
 'contacts' 
 ) 
  
 . 
 setTitle 
 ( 
 'Selected contacts' 
 ) 
  
 . 
 setPlatformDataSource 
 ( 
  
 CardService 
 . 
 newPlatformDataSource 
 (). 
 setCommonDataSource 
 ( 
  
 CardService 
 . 
 CommonDataSource 
 . 
 USER 
 , 
  
 ), 
  
 );
    Only available for Google Chat apps. Not available for Google Workspace add-ons.

    Parameters

    Name Type Description
    platform Data Source
    		Platform Data Source The data source.

    Return

    Selection Input — This object, for chaining.

    set Title(title)

    Sets the title to be shown ahead of the input field.

    Parameters

    Name Type Description
    title
    		String The input field title.

    Return

    Selection Input — This object, for chaining.

    set Type(type)

    Sets the type of this input. Defaults to CHECKBOX .

    Parameters

    Name Type Description
    type
    		Selection Input Type The selection type.

    Return

    Selection Input — This object, for chaining.
    Design a Mobile Site
    View Site in Mobile | Classic
    Share by: