一个输入字段,可用于在一组预定义选项之间进行选择。
适用于 Google Workspace 插件和 Google Chat 应用。
var 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")); var 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);
方法
方法 | 返回类型 | 简介 |
---|---|---|
addItem(text, value, selected) | SelectionInput | 添加可选择的新项。 |
addMultiSelectItem(text, value, selected, startIconUri, bottomText) | SelectionInput | 针对多选菜单添加可选择的新项。 |
setExternalDataSource(action) | SelectionInput | 设置外部数据源,例如关系型数据库。 |
setFieldName(fieldName) | SelectionInput | 设置用于标识此选择输入的键;当 还是界面互动 |
setMultiSelectMaxSelectedItems(maxSelectedItems) | SelectionInput | 设置用户可以选择的数量上限。 |
setMultiSelectMinQueryLength(queryLength) | SelectionInput | 设置用户在应用查询自动补全和查询之前输入的文本字符数 在卡片上显示建议的内容 |
setOnChangeAction(action) | SelectionInput | 设置每当选择输入更改时要执行的 Action 。 |
setPlatformDataSource(platformDataSource) | SelectionInput | 设置来自 Google Workspace 的数据源。 |
setTitle(title) | SelectionInput | 设置要在输入字段前面显示的标题。 |
setType(type) | SelectionInput | 设置此输入的类型。 |
详细文档
addItem(text, value, selected)
添加可选择的新项。
参数
名称 | 类型 | 说明 |
---|---|---|
text | Object | 要针对此项显示的文本。非字符串基元参数将转换为 字符串。 |
value | Object | 通过回调发送的表单输入值。非字符串基元参数 会自动转换为字符串。 |
selected | Boolean | 项目是否默认处于选中状态。如果选择输入只接受 一个值(如单选按钮或下拉菜单),则只能为一项设置此字段。 |
返回
SelectionInput
- 此对象,用于链接。
addMultiSelectItem(text, value, selected, startIconUri, bottomText)
针对多选菜单添加可选择的新项。
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");
参数
名称 | 类型 | 说明 |
---|---|---|
text | Object | 要针对此项显示的文本。非字符串基元参数将转换为 字符串。 |
value | Object | 通过回调发送的表单输入值。非字符串基元参数 会自动转换为字符串。 |
selected | Boolean | 项目是否默认处于选中状态。如果选择输入只接受 一个值(如单选按钮或下拉菜单),则只能为一项设置此字段。 |
startIconUri | Object | 对于多选菜单,菜单项的旁边显示的图标所对应的网址 文本字段。支持 PNG 和 JPEG 文件。 |
bottomText | Object | 对于多选菜单,文字说明或标签显示在 文字字段。 |
返回
SelectionInput
- 此对象,用于链接。
setExternalDataSource(action)
设置外部数据源,例如关系型数据库。
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"));
参数
名称 | 类型 | 说明 |
---|---|---|
action | Action | 外部数据源。 |
返回
SelectionInput
- 此对象,用于链接。
setFieldName(fieldName)
设置用于标识此选择输入的键;当 还是界面互动对用户不可见。必填,必须是唯一的。
参数
名称 | 类型 | 说明 |
---|---|---|
fieldName | String | 为此输入源指定的名称。 |
返回
SelectionInput
- 此对象,用于链接。
setMultiSelectMaxSelectedItems(maxSelectedItems)
设置用户可以选择的数量上限。
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");
参数
名称 | 类型 | 说明 |
---|---|---|
maxSelectedItems | Integer | 商品数量上限。 |
返回
SelectionInput
- 此对象,用于链接。
setMultiSelectMinQueryLength(queryLength)
设置用户在应用查询自动补全和查询之前输入的文本字符数 在卡片上显示建议的内容
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");
参数
名称 | 类型 | 说明 |
---|---|---|
queryLength | Integer | 文本字符数。 |
返回
SelectionInput
- 此对象,用于链接。
setOnChangeAction(action)
setPlatformDataSource(platformDataSource)
设置来自 Google Workspace 的数据源。用于填充多选菜单中的项。
const multiSelect = CardService.newSelectionInput() .setType(CardService.SelectionInputType.MULTI_SELECT) .setFieldName("contacts") .setTitle("Selected contacts") .setPlatformDataSource( CardService.newPlatformDataSource() .setCommonDataSource(CardService.CommonDataSource.USER));仅适用于 Google Chat 应用。不适用于 Google Workspace 插件。
参数
名称 | 类型 | 说明 |
---|---|---|
platformDataSource | PlatformDataSource | 数据源。 |
返回
SelectionInput
- 此对象,用于链接。