Multi Dropdown Input Native Mobile

✅

Link to plugin page: https://zeroqode.com/plugin/multi-dropdown-input-native-mobile-1750831096797x508361185015616200

Demo to preview the plugin

✅

Live Demo: https://zeroqode-native-demo-04.bubbleapps.io/api/1.1/mobile/preview?debug_mode=true&preview_view=multi-dropdown

✅

Bubble Editor: https://bubble.io/page?id=zeroqode-native-demo-04&tab=Design&name=multi-dropdown&type=page&version=live&elements=bTHfV

Introduction

The Multi Dropdown Input Native Mobile plugin provides a powerful and customizable multi-select dropdown component specifically designed for mobile applications in Bubble. This plugin allows users to select multiple items from a dropdown list with an intuitive interface that displays selected items as tags. The component supports both simple data types (text, numbers) and complex data types (custom data types, API data) with flexible configuration options including search functionality, selection limits, and visual customization.

Prerequisites

This plugin is designed specifically for the mobile version of the Bubble editor. To test the plugin on your mobile device, use the TestFlight app available at: https://testflight.apple.com/join/EcFCzJ32

⚠️

Please note that the testing app is currently available for iOS only.

How to setup

Setting up the Multi Dropdown Input Native Mobile plugin is straightforward:

Install the plugin from the Bubble plugin marketplace.

Add the Multi Dropdown element to your mobile page.

Configure the data source by setting the "Data type" and "Data source" fields.

For complex data types, specify the "Data label field" and the "Data ID field".

Customize the appearance and behavior using the available properties.

Set up workflows to handle the selection events.

The plugin automatically handles data processing and doesn't require any API keys or external service configuration.

Plugin Element Properties

The plugin contains a Multi Dropdown input form that should be used on mobile pages.

Multi Dropdown

Element fields

Title	Description	Type
Placeholder	Text displayed when no items are selected.	text (optional)
Data type	The type of data in the dropdown.	App Type
Data source	List of items in the dropdown. For basic datatype these are also labels.	list of “Data type”s
Data ID field	Field to use as unique identifier for complex data types.	text (field of “Data type”) (optional)
Data label field	Field to display as the label for complex data types.	text (field of “Data type”)
Default data	Pre-selected items when the dropdown loads. This list should be a sublist of "Data source" list.	list of “Data type”s (optional)
Enable search	Enables search functionality within the dropdown.	Checkbox
Max displayed items	Maximum number of selected items to show as tags in the header.	number
Max selected items	Maximum number of items that can be selected. Leave empty for unlimited.	number (optional)
Max options list height	Maximum height of the dropdown options list in pixels.	number
Selected items color	Background color for selected item tags and checkboxes.	Color

Element actions

Reset — Removes all selected items from the multi dropdown.

Exposed states

Name	Description	Type
selected items	List of currently selected items from the dropdown.	list of “Data type”s

Element Events

Name	Description
selection changed	Triggered whenever the user selects or deselects items in the dropdown.
limit reached	Triggered when the user tries to select more items than the maximum allowed.