Overview

Scaletech Dropdown Widget: The Mendix dropdown has been reimagined. You can get more done with less effort.

• Custom Display Text: Show users exactly what they need to see, no domain model changes are required.
• Dynamic Data: Bind to associations, enumerations, and more for effortless updates.
• Multi-Selection: Empower users to choose multiple options with ease. ...and much more! Try it now and give your Mendix apps a boost.

Documentation

The Scaletech Dropdown Widget is a powerful and customizable dropdown widget for Mendix applications. It leverages the react-select package to provide a feature-rich dropdown experience with multi-selection, custom labels, and flexible data-binding capabilities. This widget is perfect for scenarios where users need to select one or more items from a list, and it supports various configurations, including dynamic text templates and data sources.

Typical Usage Scenarios

• Dynamic Selection Lists: Bind to an association or enumeration to dynamically populate the dropdown options.
• Multi-Selection: Use checkboxes to allow users to select multiple options from a list.
• Customizable Labels: Display custom labels for each item in the dropdown to make it user-friendly.

Features

• Multi-Selection: Choose between checkbox or row-click selection methods, allowing users to select multiple items from the dropdown.
• Dynamic Data Binding: Bind to a data source like Association, Enumeration, or Boolean, with attributes dynamically populating the dropdown options.
• Placeholder Text: Customizable placeholder text that appears when no option is selected.
• Selection Method: Choose how items are selected (either via checkboxes or row-click).
• Select All Option: Option to display a "Select All" button to easily select all items.
• OnChange Event: Triggers a custom action when the selection changes, enabling integration with other application features.
• Conditional Visibility and Editability: Control the visibility and editability of the widget based on conditions.

Configuration

The widget is highly configurable and can be customized using the following properties:

Data Source:

• DataType: Specify the data type (Association, Enumeration, or Boolean).
• Association Data: Bind to an association (Reference or ReferenceSet) for dynamic object selection.
• Objects Datasources: A list of selectable objects that will populate the dropdown.
• Caption: Define the caption or label to be displayed for each option in the dropdown.

Selection Method:

• Selection Method: Choose between Checkbox or RowClick as the selection method.
• Select All: Show a button to select or deselect all options.

Placeholder Text:

• Placeholder Text: Define custom placeholder text when no option is selected.

Events:

• OnChange: Trigger an action when the selection changes.

Label:

• Label: Define a label for the dropdown widget (e.g., "Choose an option").

Conditional Visibility:

• Visibility: Set conditions to control the widget's visibility.

Editability:

• Editability: Set whether the widget is editable by the user or not.

Installation

1. Download the Widget: Obtain the .mpk file for the Scaletech Dropdown from the Mendix Marketplace.
2. Import the Widget: Import the .mpk file into your Mendix application.
3. Add to a Page: Drag and drop the widget onto your desired page.

Frequently Asked Questions

• Q1: Can I dynamically populate the dropdown?
  • Yes, you can bind the dropdown to various data sources like associations or enumerations.
• Q2: How can I allow multiple selections?
  • Use the Checkbox selection method for multi-selection.
• Q3: Is there a way to trigger an action when the selection changes?
  • Yes, the widget includes an OnChange event property to handle selection changes.

Demo Project:-  https://scaletechdropdown100-sandbox.mxapps.io/login.html?profile=Responsive

User id:- demo_administrator

Password:- 3LzMzTuPJV6t

Contributors:- Avinash Pansuriya