A component that lets you display and manage a list of items with selection, reordering, transfer, and drag-and-drop. Supports single/multiple selection via SelectionMode, two-way binding through SelectedItems/SelectedItemsChanged, toolbar tools (move, transfer, remove), connected list boxes via Id and ConnectedListBoxId, custom ItemTemplate and NoDataTemplate, sizing and dimensions, ARIA labeling, and events for reorder/transfer/remove/drop.
Definition
Namespace:Telerik.Blazor.Components
Assembly:Telerik.Blazor.dll
Type Parameters:
TItem
Syntax:
public class TelerikListBox<TItem> : DataBoundComponent<TItem>, IComponent, IHandleEvent, IHandleAfterRender, IDisposable
Inheritance: objectComponentBaseBaseComponentDataBoundComponent<TItem>TelerikListBox<TItem>
Implements:
Inherited Members
Constructors
public TelerikListBox()
Methods
protected override void BuildRenderTree(RenderTreeBuilder __builder)
Overrides:
public override void Dispose()
Overrides:
protected override void OnInitialized()
Overrides:
Re-renders the component.
public void Refresh()
public override Task SetParametersAsync(ParameterView parameters)
Overrides:
Properties
[Accessibility] Describe the aria-label attribute for the items list.
[Parameter]
public string AriaLabel { get; set; }
[Accessibility] Describe the aria-labelledby attribute for the items list.
[Parameter]
public string AriaLabelledBy { get; set; }
The id of the list box you want to connect this list box with. Its value should be the same as the Id value of the connected list box.
[Parameter]
public string ConnectedListBoxId { get; set; }
Specifies whether the list box items can be dragged and dropped. This applies to both items within the same list box, as well as across multiple list boxes. Default value is false.
[Parameter]
public bool Draggable { get; set; }
Specifies the ids of the list box components that can drag and drop items to the current list box. The DropSources option describes a one-way relationship. If you want a two-way connection, set the DropSources option to both components.
[Parameter]
public List<string> DropSources { get; set; }
Whether the list box is enabled. Default value is true.
[Parameter]
public bool Enabled { get; set; }
Enables WebMCP tool registration for this ListBox, allowing AI models to discover and invoke list box operations.
[Parameter]
public bool EnableWebMcpTools { get; set; }
Defines the component height as a CSS value.
[Parameter]
public string Height { get; set; }
The id of the list box. If you want to connect multiple list boxes, assign the same value to the ConnectedListBoxId of the corresponding list box.
[Parameter]
public string Id { get; set; }
ItemTemplate
RenderFragment<TItem>
The item template of the list box items. Use to override the default rendering of individual items.
[Parameter]
public RenderFragment<TItem> ItemTemplate { get; set; }
Defines the settings container for the ListBox. Place ListBoxWebMcpSettings inside.
[Parameter]
public RenderFragment ListBoxSettings { get; set; }
The container for the list box tool bar. Add a ListBoxToolBar tag within this fragment. Children: ListBoxToolBar.
[Parameter]
public RenderFragment ListBoxToolBarSettings { get; set; }
Defines the content of the list box when there is no data.
[Parameter]
public RenderFragment NoDataTemplate { get; set; }
Fires when the user initiate deletion of items. The event fires only for the list box owning the tool bar.
[Parameter]
public EventCallback<ListBoxRemoveEventArgs<TItem>> OnRemove { get; set; }
Fires when the user initiate reorder of items. The event fires only for the list box owning the tool bar.
[Parameter]
public EventCallback<ListBoxReorderEventArgs<TItem>> OnReorder { get; set; }
Fires when the user initiates a transfer of items from one list box to another list box. The event fires only for the list box owning the tool bar.
[Parameter]
public EventCallback<ListBoxTransferEventArgs<TItem>> OnTransfer { get; set; }
SelectedItems
IEnumerable<TItem>
Specifies the selected items. Used with two-way binding.
[Parameter]
public IEnumerable<TItem> SelectedItems { get; set; }
Specifies the callback that's called when the selected items change.
[Parameter]
public EventCallback<IEnumerable<TItem>> SelectedItemsChanged { get; set; }
Defines the TextField of the Data. Default value: "Text".
[Parameter]
public string TextField { get; set; }