Se usó la API de Cloud Translation para traducir esta página.

Class SelectionInput
Organiza tus páginas con colecciones Guarda y categoriza el contenido según tus preferencias.

Es un campo de entrada que permite elegir entre un conjunto de opciones predefinidas.

Admite la validación del envío de formularios solo para los menús SelectionInputType.DROP_DOWN y SelectionInputType.MULTI_SELECT. Cuando Action.setAllWidgetsAreRequired(allWidgetsAreRequired) se establece en true o se especifica este widget a través de Action.addRequiredWidget(requiredWidget), se bloquea la acción de envío, a menos que se seleccione un valor.

Disponible para complementos de Google Workspace y apps de Google Chat.

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);

Métodos

Método	Tipo de datos que se muestra	Descripción breve
`addItem(text, value, selected)`	`SelectionInput`	Agrega un elemento nuevo que se puede seleccionar.
`addMultiSelectItem(text, value, selected, startIconUri, bottomText)`	`SelectionInput`	Agrega un elemento nuevo que se puede seleccionar para los menús de selección múltiple.
`setExternalDataSource(action)`	`SelectionInput`	Establece una fuente de datos externa, como una base de datos relacional.
`setFieldName(fieldName)`	`SelectionInput`	Establece la clave que identifica esta entrada de selección en el objeto de evento que se genera cuando hay una interacción de la IU.
`setMultiSelectMaxSelectedItems(maxSelectedItems)`	`SelectionInput`	Establece la cantidad máxima de elementos que un usuario puede seleccionar.
`setMultiSelectMinQueryLength(queryLength)`	`SelectionInput`	Establece la cantidad de caracteres de texto que un usuario ingresa antes de que la app consulte el autocompletado y muestre los elementos sugeridos en la tarjeta.
`setOnChangeAction(action)`	`SelectionInput`	Establece un `Action` que se realizará cada vez que cambie la entrada de selección.
`setPlatformDataSource(platformDataSource)`	`SelectionInput`	Establece una fuente de datos de Google Workspace.
`setTitle(title)`	`SelectionInput`	Establece el título que se mostrará antes del campo de entrada.
`setType(type)`	`SelectionInput`	Establece el tipo de esta entrada.

Documentación detallada

`addItem(text, value, selected)`

Agrega un elemento nuevo que se puede seleccionar.

Parámetros

Nombre	Tipo	Descripción
`text`	`Object`	Es el texto que se mostrará para este elemento. Los argumentos primitivos que no son cadenas se convierten en cadenas automáticamente.
`value`	`Object`	Es el valor de entrada del formulario que se envía a través de la devolución de llamada. Los argumentos primitivos que no son cadenas se convierten en cadenas automáticamente.
`selected`	`Boolean`	Indica si el elemento está seleccionado de forma predeterminada. Si la entrada de selección solo acepta un valor (como en el caso de los botones de selección o un menú desplegable), configura este campo solo para un elemento.

Volver

SelectionInput: Este objeto, para encadenar.

`addMultiSelectItem(text, value, selected, startIconUri, bottomText)`

Agrega un elemento nuevo que se puede seleccionar para los menús de selección múltiple.

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',
        );

Parámetros

Nombre	Tipo	Descripción
`text`	`Object`	Es el texto que se mostrará para este elemento. Los argumentos primitivos que no son cadenas se convierten en cadenas automáticamente.
`value`	`Object`	Es el valor de entrada del formulario que se envía a través de la devolución de llamada. Los argumentos primitivos que no son cadenas se convierten en cadenas automáticamente.
`selected`	`Boolean`	Indica si el elemento está seleccionado de forma predeterminada. Si la entrada de selección solo acepta un valor (como en el caso de los botones de selección o un menú desplegable), configura este campo solo para un elemento.
`startIconUri`	`Object`	Para los menús de selección múltiple, la URL del ícono que se muestra junto al campo de texto del elemento Admite archivos PNG y JPEG.
`bottomText`	`Object`	En el caso de los menús de selección múltiple, es una descripción o etiqueta de texto que se muestra debajo del campo de texto del elemento.

Volver

SelectionInput: Este objeto, para encadenar.

`setExternalDataSource(action)`

Establece una fuente de datos externa, como una base de datos relacional.

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'),
        );

Parámetros

Nombre	Tipo	Descripción
`action`	`Action`	La fuente de datos externa.

Volver

SelectionInput: Este objeto, para encadenar.

`setFieldName(fieldName)`

Establece la clave que identifica esta entrada de selección en el objeto de evento que se genera cuando hay una interacción de la IU. No es visible para el usuario. Obligatorio, debe ser único.

Parámetros

Nombre	Tipo	Descripción
`fieldName`	`String`	Es el nombre que se asignará a esta entrada.

Volver

SelectionInput: Este objeto, para encadenar.

`setMultiSelectMaxSelectedItems(maxSelectedItems)`

Establece la cantidad máxima de elementos que un usuario puede seleccionar.

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',
        );

Parámetros

Nombre	Tipo	Descripción
`maxSelectedItems`	`Integer`	Es la cantidad máxima de elementos.

Volver

SelectionInput: Este objeto, para encadenar.

`setMultiSelectMinQueryLength(queryLength)`

Establece la cantidad de caracteres de texto que un usuario ingresa antes de que la app consulte el autocompletado y muestre los elementos sugeridos en la tarjeta.

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',
        );

Parámetros

Nombre	Tipo	Descripción
`queryLength`	`Integer`	Es la cantidad de caracteres de texto.

Volver

SelectionInput: Este objeto, para encadenar.

`setOnChangeAction(action)`

Establece un Action que se realizará cada vez que cambie la entrada de selección.

Parámetros

Nombre	Tipo	Descripción
`action`	`Action`	La acción por realizar.

Volver

SelectionInput: Este objeto, para encadenar.

`setPlatformDataSource(platformDataSource)`

Establece una fuente de datos de Google Workspace. Se usa para propagar elementos en un menú de selección múltiple.

const multiSelect =
    CardService.newSelectionInput()
        .setType(CardService.SelectionInputType.MULTI_SELECT)
        .setFieldName('contacts')
        .setTitle('Selected contacts')
        .setPlatformDataSource(
            CardService.newPlatformDataSource().setCommonDataSource(
                CardService.CommonDataSource.USER,
                ),
        );

Solo está disponible para las apps de Google Chat. No está disponible para complementos de Google Workspace.

Parámetros

Nombre	Tipo	Descripción
`platformDataSource`	`PlatformDataSource`	La fuente de datos.

Volver

SelectionInput: Este objeto, para encadenar.

`setTitle(title)`

Establece el título que se mostrará antes del campo de entrada.

Parámetros

Nombre	Tipo	Descripción
`title`	`String`	Es el título del campo de entrada.

Volver

SelectionInput: Este objeto, para encadenar.

`setType(type)`

Establece el tipo de esta entrada. La configuración predeterminada es CHECKBOX.

Parámetros

Nombre	Tipo	Descripción
`type`	`SelectionInputType`	Es el tipo de selección.

Volver

SelectionInput: Este objeto, para encadenar.

Class SelectionInput Organiza tus páginas con colecciones Guarda y categoriza el contenido según tus preferencias.

Métodos

Documentación detallada

addItem(text, value, selected)

Parámetros

Volver

addMultiSelectItem(text, value, selected, startIconUri, bottomText)

Parámetros

Volver

setExternalDataSource(action)

Parámetros

Volver

setFieldName(fieldName)

Parámetros

Volver

setMultiSelectMaxSelectedItems(maxSelectedItems)

Parámetros

Volver

setMultiSelectMinQueryLength(queryLength)

Parámetros

Volver

setOnChangeAction(action)

Parámetros

Volver

setPlatformDataSource(platformDataSource)

Parámetros

Volver

setTitle(title)

Parámetros

Volver

setType(type)

Parámetros

Volver

Class SelectionInput
Organiza tus páginas con colecciones Guarda y categoriza el contenido según tus preferencias.

`addItem(text, value, selected)`

`addMultiSelectItem(text, value, selected, startIconUri, bottomText)`

`setExternalDataSource(action)`

`setFieldName(fieldName)`

`setMultiSelectMaxSelectedItems(maxSelectedItems)`

`setMultiSelectMinQueryLength(queryLength)`

`setOnChangeAction(action)`

`setPlatformDataSource(platformDataSource)`

`setTitle(title)`

`setType(type)`