ช่องป้อนข้อมูลที่ช่วยให้เลือกระหว่างชุดตัวเลือกที่กำหนดไว้ล่วงหน้า
ใช้ได้กับส่วนเสริมของ 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 | ตั้งค่าคีย์ที่ระบุอินพุตการเลือกนี้ในออบเจ็กต์เหตุการณ์ที่สร้างขึ้นเมื่อมีการโต้ตอบใน UI |
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 | สำหรับเมนูแบบเลือกหลายรายการ URL สำหรับไอคอนที่แสดงถัดจากช่องข้อความของรายการ รองรับไฟล์ 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)
ตั้งค่าคีย์ที่ระบุอินพุตการเลือกนี้ในออบเจ็กต์เหตุการณ์ที่สร้างขึ้นเมื่อมีการโต้ตอบใน UI ผู้ใช้จะไม่เห็น ต้องระบุ ต้องไม่ซ้ำกัน
พารามิเตอร์
ชื่อ | ประเภท | คำอธิบาย |
---|---|---|
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)
ตั้งค่า Action
ที่จะดําเนินการเมื่ออินพุตการเลือกเปลี่ยนแปลง
พารามิเตอร์
ชื่อ | ประเภท | คำอธิบาย |
---|---|---|
action | Action | การดำเนินการที่ต้องทำ |
รีเทิร์น
SelectionInput
— ออบเจ็กต์นี้สำหรับการทำเชน
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
— ออบเจ็กต์นี้สำหรับการทำเชน
setTitle(title)
ตั้งชื่อที่จะแสดงก่อนช่องป้อนข้อมูล
พารามิเตอร์
ชื่อ | ประเภท | คำอธิบาย |
---|---|---|
title | String | ชื่อช่องป้อนข้อมูล |
รีเทิร์น
SelectionInput
— ออบเจ็กต์นี้สำหรับการทำเชน
setType(type)
ตั้งค่าประเภทของอินพุตนี้ ค่าเริ่มต้นคือ CHECKBOX
พารามิเตอร์
ชื่อ | ประเภท | คำอธิบาย |
---|---|---|
type | SelectionInputType | ประเภทการเลือก |
รีเทิร์น
SelectionInput
— ออบเจ็กต์นี้สำหรับการทำเชน