DxTreeList.FocusedRowChanged Event
Fires when row focus changes.
Namespace: DevExpress.Blazor
Assembly: DevExpress.Blazor.v24.2.dll
NuGet Package: DevExpress.Blazor
Declaration
[Parameter]
public EventCallback<TreeListFocusedRowChangedEventArgs> FocusedRowChanged { get; set; }
Parameters
Type | Description |
---|---|
TreeListFocusedRowChangedEventArgs | An object that contains data for this event. |
Remarks
When the FocusedRowEnabled property is set to true
, the TreeList displays the focused row. Use the FocusedRowChanged
event to handle focused row changes. The following event argument properties allow you to get information about the focused row.
- VisibleIndex
- If a data row is focused, this property returns this row’s visible index. The property returns
-1
if a new row is focused or the TreeList displays no rows. - DataItem
- If a data row is focused, this property returns the data item bound to this row. The property returns
null
if a new row is focused or the TreeList displays no rows.
The FocusedRowChanged
event fires in the following cases:
- A user clicks a row to focus it.
- A data row switches to edit mode.
- You call the SetFocusedRowIndex(Int32) method.
- The TreeList moves focus to a row on the initial load or when visible rows change (for instance, when you apply a filter or sorting or a page changes).
In the following code snippet, the TreeList component displays additional information about the focused space object:
@inject SpaceObjectDataProvider SpaceObjectDataProvider
<DxTreeList Data="TreeListData"
ChildrenFieldName="Satellites"
FocusedRowEnabled="true"
FocusedRowChanged="TreeList_FocusedRowChanged">
<Columns>
<DxTreeListDataColumn FieldName="Name" />
<DxTreeListDataColumn FieldName="TypeOfObject" Caption="Type" />
<DxTreeListDataColumn FieldName="Mass10pow21kg" Caption="Mass, kg" DisplayFormat="N2">
<HeaderCaptionTemplate>Mass, 10<sup>21</sup> × kg</HeaderCaptionTemplate>
</DxTreeListDataColumn>
<DxTreeListDataColumn FieldName="MeanRadiusInKM" Caption="Radius, km" DisplayFormat="N2" />
<DxTreeListDataColumn FieldName="Volume10pow9KM3" DisplayFormat="N2">
<HeaderCaptionTemplate>Volume, 10<sup>9</sup> × km<sup>3</sup></HeaderCaptionTemplate>
</DxTreeListDataColumn>
<DxTreeListDataColumn FieldName="SurfaceGravity" DisplayFormat="N2">
<HeaderCaptionTemplate>Gravity, m/s<sup>2</sup></HeaderCaptionTemplate>
</DxTreeListDataColumn>
</Columns>
</DxTreeList>
@if (FocusedSpaceObject != null) {
<h5>@FocusedSpaceObject.Name</h5>
<ul>
<li><b>Radius</b>: @FocusedSpaceObject.MeanRadiusInKM.ToString("N2") km</li>
<li><b>Density</b>: @FocusedSpaceObject.Density.ToString("N2") g/cm<sup>3</sup></li>
<li><b>Gravity</b>: @FocusedSpaceObject.SurfaceGravity.ToString("N2") m/s<sup>2</sup></li>
</ul>
}
@code {
object TreeListData { get; set; }
SpaceObject FocusedSpaceObject { get; set; }
protected override async Task OnInitializedAsync() {
TreeListData = SpaceObjectDataProvider.GenerateData();
}
void TreeList_FocusedRowChanged(TreeListFocusedRowChangedEventArgs e) {
FocusedSpaceObject = e.DataItem as SpaceObject;
}
}
For more information about row focus in the TreeList component, refer to the following topic: Selection and Focus in Blazor TreeList.