Blazor ListBox Example - Drag and Drop
This sample demonstrates the drag and drop functionalities of a ListBox component. Drag an item or a group of selected items and drop it within the same listbox or into another listbox.
Group A
- Australia
- Bermuda
- Canada
- Cameroon
- Denmark
- France
- Finland
- Germany
- Hong Kong
Group B
- India
- Italy
- Japan
- Mexico
- Norway
- Poland
- Switzerland
- United Kingdom
- United States
The ListBox component allows the user to drag and drop a desired item from one listbox into another listbox. The drag and drop feature can be enabled by using the following properties:
- To drag and drop a desired item within the ListBox, the AllowDragAndDrop property should be set to true.
- To drag and drop between multiple listboxes, the Scope property should be set to both the listboxes.
In this sample, a list of countries is loaded in Group A and another list of countries is loaded in Group B. You can drag and drop an item or multiple items from Group A to Group B, and vice versa.
More information about drag and drop functionalities of the Blazor ListBox component can be found in the documentation section.