Skip to main content
All docs
V25.1
  • DxTreeList.EditOnKeyPress Property

    In EditCell mode, specifies whether cell editing starts once a user begins typing a new value.

    Namespace: DevExpress.Blazor

    Assembly: DevExpress.Blazor.v25.1.dll

    NuGet Package: DevExpress.Blazor

    Declaration

    [DefaultValue(false)]
    [Parameter]
    public bool EditOnKeyPress { get; set; }

    Property Value

    Type Default Description
    Boolean false

    true to start cell editing once a user begins typing a new value; otherwise, false.

    Remarks

    Note

    This property is in effect only if the EditMode property value is EditCell.

    In EditCell mode, the TreeList component starts cell editing after a user clicks a cell or focuses it and presses Enter. Enable the EditOnKeyPress property to additionally enter edit mode once a user presses one of the following keys:

    • Alphabetic characters
    • Numerals
    • Punctuation marks
    • Special characters
    • Space
    • Backspace
    • Alt+Down[1]

    The following example allows users to enter edit mode once they start typing a new value:

    @inject EmployeeTaskService EmployeeTaskService
    
    <DxTreeList Data="TreeListData"
                KeyFieldName="Id"
                ParentKeyFieldName="ParentId"
                EditMode="TreeListEditMode.EditCell"
                EditModelSaving="TreeList_EditModelSaving"
                DataItemDeleting="TreeList_DataItemDeleting"
                CustomizeEditModel="TreeList_CustomizeEditModel"
                EditOnKeyPress="true">
        <Columns>
            <DxTreeListCommandColumn EditButtonVisible="false"
                                     CancelButtonVisible="false"
                                     SaveButtonVisible="false" />
            <DxTreeListDataColumn FieldName="Name" Caption="Task" />
            <DxTreeListDataColumn FieldName="EmployeeName" />
            <DxTreeListDataColumn FieldName="StartDate" />
            <DxTreeListDataColumn FieldName="DueDate" />
        </Columns>
    </DxTreeList>
    
    @code {
        List<EmployeeTask> TreeListData { get; set; }
    
        protected override void OnInitialized() {
            TreeListData = EmployeeTaskService.GenerateData();
        }
        void TreeList_CustomizeEditModel(TreeListCustomizeEditModelEventArgs e) {
            if(e.IsNew) {
                var newTask = (EmployeeTask)e.EditModel;
                newTask.Id = TreeListData.Max(x => x.Id) + 1;
                if(e.ParentDataItem != null)
                    newTask.ParentId = ((EmployeeTask)e.ParentDataItem).Id;
            }
        }
        async Task TreeList_EditModelSaving(TreeListEditModelSavingEventArgs e) {
            if(e.IsNew)
                TreeListData.Add((EmployeeTask)e.EditModel);
            else
                e.CopyChangesToDataItem();
        }
        async Task TreeList_DataItemDeleting(TreeListDataItemDeletingEventArgs e) {
            TreeListData.Remove((EmployeeTask)e.DataItem);
        }
    }
    
    Footnotes
    1. Available for combobox, date edit, and time edit DevExpress data editors.

    See Also