Class SelectionInput

SelectionInput

Kolom input yang memungkinkan pemilihan di antara serangkaian opsi standar.

Mendukung validasi pengiriman formulir untuk menu SelectionInputType.DROP_DOWN dan SelectionInputType.MULTI_SELECT saja. Jika Action.setAllWidgetsAreRequired(allWidgetsAreRequired) disetel ke true atau widget ini ditentukan melalui Action.addRequiredWidget(requiredWidget), tindakan pengiriman akan diblokir kecuali jika nilai dipilih.

Tersedia untuk add-on Google Workspace dan aplikasi 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);

Metode

Metode	Jenis nilai yang ditampilkan	Deskripsi singkat
addDataSourceConfig(dataSourceConfig)	SelectionInput	Menetapkan konfigurasi sumber data untuk kontrol pilihan.
addEventAction(eventAction)	Widget	Menambahkan tindakan peristiwa yang dapat dilakukan pada widget.
addItem(text, value, selected)	SelectionInput	Menambahkan item baru yang dapat dipilih.
addMultiSelectItem(text, value, selected, startIconUri, bottomText)	SelectionInput	Menambahkan item baru yang dapat dipilih, untuk menu pilihan ganda.
setExternalDataSource(action)	SelectionInput	Menetapkan sumber data eksternal, seperti database relasional.
setFieldName(fieldName)	SelectionInput	Menetapkan kunci yang mengidentifikasi input pilihan ini dalam objek peristiwa yang dibuat saat ada interaksi UI.
setId(id)	Widget	Menetapkan ID unik yang ditetapkan yang digunakan untuk mengidentifikasi widget yang akan diubah.
setMultiSelectMaxSelectedItems(maxSelectedItems)	SelectionInput	Menetapkan jumlah maksimum item yang dapat dipilih pengguna.
setMultiSelectMinQueryLength(queryLength)	SelectionInput	Menetapkan jumlah karakter teks yang dimasukkan pengguna sebelum aplikasi membuat kueri pelengkapan otomatis dan menampilkan item yang disarankan di kartu.
setOnChangeAction(action)	SelectionInput	Menetapkan Action yang akan dilakukan setiap kali input pilihan berubah.
setPlatformDataSource(platformDataSource)	SelectionInput	Menetapkan sumber data dari Google Workspace.
setTitle(title)	SelectionInput	Menetapkan judul yang akan ditampilkan di depan kolom input.
setType(type)	SelectionInput	Menetapkan jenis input ini.
setVisibility(visibility)	Widget	Menetapkan visibilitas widget.

Dokumentasi mendetail

addDataSourceConfig(dataSourceConfig)

Menetapkan konfigurasi sumber data untuk kontrol pilihan. Kolom ini memberikan kontrol yang lebih terperinci atas sumber data. Kolom ini bersifat opsional.

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

Parameter

Nama	Jenis	Deskripsi
dataSourceConfig	DataSourceConfig	Konfigurasi sumber data yang akan diterapkan ke input pilihan.

Pulang pergi

SelectionInput — Objek ini, untuk dirangkaikan.

---

addEventAction(eventAction)

Menambahkan tindakan peristiwa yang dapat dilakukan pada widget.

Parameter

Nama	Jenis	Deskripsi
eventAction	EventAction	EventAction yang akan ditambahkan.

Pulang pergi

Widget — Objek, untuk dirangkaikan.

---

addItem(text, value, selected)

Menambahkan item baru yang dapat dipilih.

Parameter

Nama	Jenis	Deskripsi
text	Object	Teks yang akan ditampilkan untuk item ini. Argumen primitif non-string otomatis dikonversi menjadi string.
value	Object	Nilai input formulir yang dikirim melalui callback. Argumen primitif non-string dikonversi menjadi string secara otomatis.
selected	Boolean	Apakah item dipilih secara default. Jika input pilihan hanya menerima satu nilai (seperti untuk tombol pilihan atau menu dropdown), tetapkan kolom ini hanya untuk satu item.

Pulang pergi

SelectionInput — Objek ini, untuk dirangkaikan.

---

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

Menambahkan item baru yang dapat dipilih, untuk menu pilihan ganda.

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

Parameter

Nama	Jenis	Deskripsi
text	Object	Teks yang akan ditampilkan untuk item ini. Argumen primitif non-string otomatis dikonversi menjadi string.
value	Object	Nilai input formulir yang dikirim melalui callback. Argumen primitif non-string dikonversi menjadi string secara otomatis.
selected	Boolean	Apakah item dipilih secara default. Jika input pilihan hanya menerima satu nilai (seperti untuk tombol pilihan atau menu dropdown), tetapkan kolom ini hanya untuk satu item.
startIconUri	Object	Untuk menu pilihan ganda, URL untuk ikon yang ditampilkan di samping kolom teks item. Mendukung file PNG dan JPEG.
bottomText	Object	Untuk menu pilihan ganda, deskripsi atau label teks yang ditampilkan di bawah kolom teks item.

Pulang pergi

SelectionInput — Objek ini, untuk dirangkaikan.

---

setExternalDataSource(action)

Menetapkan sumber data eksternal, seperti database relasional.

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

Parameter

Nama	Jenis	Deskripsi
action	Action	Sumber data eksternal.

Pulang pergi

SelectionInput — Objek ini, untuk dirangkaikan.

---

setFieldName(fieldName)

Menetapkan kunci yang mengidentifikasi input pilihan ini dalam objek peristiwa yang dibuat saat ada interaksi UI. Tidak terlihat oleh pengguna. Wajib diisi, harus unik.

Parameter

Nama	Jenis	Deskripsi
fieldName	String	Nama yang akan ditetapkan ke input ini.

Pulang pergi

SelectionInput — Objek ini, untuk dirangkaikan.

---

setId(id)

Menetapkan ID unik yang ditetapkan yang digunakan untuk mengidentifikasi widget yang akan diubah. Mutasi widget hanya didukung di Add-On.

Parameter

Nama	Jenis	Deskripsi
id	String	ID widget, dengan batas 64 karakter dan dalam format `[a-zA-Z0-9-]+`.

Pulang pergi

Widget — Objek ini, untuk dirangkaikan.

---

setMultiSelectMaxSelectedItems(maxSelectedItems)

Menetapkan jumlah maksimum item yang dapat dipilih pengguna.

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

Parameter

Nama	Jenis	Deskripsi
maxSelectedItems	Integer	Jumlah maksimum item.

Pulang pergi

SelectionInput — Objek ini, untuk dirangkaikan.

---

setMultiSelectMinQueryLength(queryLength)

Menetapkan jumlah karakter teks yang dimasukkan pengguna sebelum aplikasi membuat kueri pelengkapan otomatis dan menampilkan item yang disarankan di kartu.

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

Parameter

Nama	Jenis	Deskripsi
queryLength	Integer	Jumlah karakter teks.

Pulang pergi

SelectionInput — Objek ini, untuk dirangkaikan.

---

setOnChangeAction(action)

Menetapkan Action yang akan dilakukan setiap kali input pilihan berubah.

Parameter

Nama	Jenis	Deskripsi
action	Action	Tindakan yang harus dilakukan.

Pulang pergi

SelectionInput — Objek ini, untuk dirangkaikan.

---

setPlatformDataSource(platformDataSource)

Menetapkan sumber data dari Google Workspace. Digunakan untuk mengisi item di menu pilihan ganda.

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

Hanya tersedia untuk aplikasi Google Chat. Tidak tersedia untuk add-on Google Workspace.

Parameter

Nama	Jenis	Deskripsi
platformDataSource	PlatformDataSource	Sumber data.

Pulang pergi

SelectionInput — Objek ini, untuk dirangkaikan.

---

setTitle(title)

Menetapkan judul yang akan ditampilkan di depan kolom input.

Parameter

Nama	Jenis	Deskripsi
title	String	Judul kolom input.

Pulang pergi

SelectionInput — Objek ini, untuk dirangkaikan.

---

setType(type)

Menetapkan jenis input ini. Default-nya adalah CHECKBOX.

Parameter

Nama	Jenis	Deskripsi
type	SelectionInputType	Jenis pilihan.

Pulang pergi

SelectionInput — Objek ini, untuk dirangkaikan.

---

setVisibility(visibility)

Menetapkan visibilitas widget. Nilai defaultnya adalah `VISIBLE`.

Parameter

Nama	Jenis	Deskripsi
visibility	Visibility	Visibility widget.

Pulang pergi

Widget — Objek, untuk dirangkaikan.