DxListBox<TData, TValue>.ItemClick Event

Fires when a user clicks/taps a list box item or focuses it and presses Enter.

Assembly : DevExpress.Blazor.v25.2.dll

Declaration

csharp

[Parameter]
public EventCallback<ListBoxItemClickEventArgs<TData, TValue>> ItemClick { get; set; }

Parameters

Type	Description
ListBoxItemClickEventArgs<TData, TValue>

A ListBoxItemClickEventArgs<TData, TValue> object that contains data for this event.

Remarks

You can handle the ItemClick event in response to the following actions:

A user clicks a list box item with a pointing device.
A user focuses a list box item with keyboard navigation (↑/↓ keys) and presses Enter.

In a handler, you can use the following ListBoxItemClickEventArgs<TData, TValue> argument properties:

InputDeviceDetermines which action triggered the event.DataItemAllows you to access the processed item.VisibleIndexReturns the clicked item’s visible index.ListBoxAllows you to access List Box APIs.AltKey, CtrlKey, ShiftKeySpecify whether the Alt, Ctrl/Option, or Shift keys were pressed when the ItemClick event fired. For additional information, refer to Item Selection | Select Items in the UI.

Note

By default, the List Box triggers item selection when a user clicks an item or focuses it and presses the Space key. You can handle the ItemClick event to also treat Enter as a selection key.

The following code determines which action triggers the ItemClick event. If a user presses the Enter key, the List Box selects the corresponding item.

Razor
StaffData

razor

<DxListBox Data="@Staff.DataSource"
           TData="Person"
           TValue="Person"
           @bind-Value="ListBoxValue"
           ItemClick="@OnItemClick">
    <Columns>
        <DxListEditorColumn FieldName="@nameof(Person.FirstName)" Caption="First Name" />
        <DxListEditorColumn FieldName="@nameof(Person.LastName)" Caption="Last Name" />
        <DxListEditorColumn FieldName="@nameof(Person.Department)" />
    </Columns>
</DxListBox>

@code {
    Person ListBoxValue;

    void OnItemClick(ListBoxItemClickEventArgs<Person, Person> args) {
        if (args.InputDevice == InputDevice.Keyboard) {
            args.ListBox.BeginUpdate();
            args.ListBox.Value = args.DataItem;
            args.ListBox.EndUpdate();
        }
    }
}

namespace StaffData {
    public static class Staff {
        private static readonly Lazy<List<Person>> dataSource = new Lazy<List<Person>>(() => {
            var dataSource = new List<Person>() {
                new Person() { Id = 0 , FirstName = "John", LastName = "Heart", Department=Department.Electronics },
                new Person() { Id = 1 , FirstName = "Samantha", LastName = "Bright", Department=Department.Motors },
                new Person() { Id = 2 , FirstName = "Arthur", LastName = "Miller", Department=Department.Software },
                new Person() { Id = 3 , FirstName = "Robert", LastName = "Reagan", Department=Department.Electronics },
                new Person() { Id = 4 , FirstName= "Greta", LastName = "Sims", Department=Department.Motors },
                new Person() { Id = 5 , FirstName = "Brett", LastName = "Wade", Department=Department.Software },
                new Person() { Id = 6 , FirstName = "Sandra", LastName = "Johnson", Department=Department.Electronics },
                new Person() { Id = 7 , FirstName = "Edward", LastName = "Holmes", Department=Department.Motors },
                new Person() { Id = 8 , FirstName = "Barbara", LastName = "Banks", Department=Department.Software },
                new Person() { Id = 9 , FirstName = "Kevin", LastName = "Carter", Department=Department.Electronics }, 
                new Person() { Id = 10, FirstName = "Cynthia", LastName = "Stanwick", Department=Department.Motors },
                new Person() { Id = 11, FirstName = "Sam", LastName = "Hill", Department=Department.Electronics }};
            return dataSource;
        });
        public static List<Person> DataSource { get { return dataSource.Value; } }
    }

    public class Person {
        public int Id { get; set; }
        public string FirstName { get; set; }
        public string LastName { get; set; }
        public Department Department { get; set; }
        public string Text => $"{FirstName} {LastName} ({Department} Dept.)";
        public override bool Equals(object obj) {
            if (obj is Person typedObj) {
                return (this.Id == typedObj.Id) && (this.FirstName == typedObj.FirstName) && (this.LastName == typedObj.LastName)
                && (this.Department == typedObj.Department);
            }
            return base.Equals(obj);
        }
        public override int GetHashCode() {
            return HashCode.Combine(Id, FirstName, LastName);
        }
    }

    public enum Department { Motors, Electronics, Software }
}