DxGridDataColumn.EditSettings Property

Allows you to customize the editor associated with this column.

Assembly : DevExpress.Blazor.v25.2.dll

Declaration

csharp

[Parameter]
public RenderFragment EditSettings { get; set; }

Property Value

Type	Description
RenderFragment

A render fragment that declares cell editor settings.

Remarks

The Grid component generates and configures cell editors for columns based on associated data types. The component automatically displays column editors in the filter row and in data rows during edit operations. You can also place these editors in the edit form or pop-up edit form.

Declare an object that contains editor settings in the <EditSettings> tag. This is how you can customize the default editor or replace it with another editor. If the editor does not support the associated data type, the Grid replaces it with a read-only text box. In the filter row, the Grid displays text box editors for all columns whose FilterMode is set to DisplayText.

The table below list classes that define cell editor settings and the corresponding data types:

Editor Settings

Generated for Data Types

Supported Data Types

| | --- | --- | --- | |

DxCheckBoxSettings [1]

Boolean

All data types

| |

DxComboBoxSettings

Enum

All data types

| |

DxDateEditSettings

DateOnly, DateTime, DateTimeOffset

| |

DxMaskedInputSettings

Never generated

Numeric, String, TimeSpan, TimeOnly,
DateTime, DateOnly, DateTimeOffset

| |

Never generated

| |

| |

| |

TimeOnly, TimeSpan, DateTime

Handle the Grid’s CustomizeFilterRowEditor event to customize editors in the filter row. The CustomizeDataRowEditor event allows you to customize editors displayed in data rows, edit forms, or pop-up edit forms. At runtime, call the GetColumnEditSettings<T>(String) to access and customize editor settings.

The following code snippet customizes editors of Birth Date and Home Phone columns:

Razor
NorthwindContext
Employee.cs

razor

@inject IDbContextFactory<NorthwindContext> NorthwindContextFactory

<DxGrid @ref="Grid"
        Data="Employees"
        EditMode="GridEditMode.EditRow">
    <Columns>
        <DxGridCommandColumn />
        <DxGridDataColumn FieldName="LastName" />
        <DxGridDataColumn FieldName="FirstName" />
        <DxGridDataColumn FieldName="BirthDate">
            <EditSettings>
                <DxDateEditSettings DisplayFormat="M" Format="d" />
            </EditSettings>
        </DxGridDataColumn>
        <DxGridDataColumn FieldName="HomePhone" >
            <EditSettings>
                <DxMaskedInputSettings Mask="(000) 000-0000"
                                       ClearButtonDisplayMode="DataEditorClearButtonDisplayMode.Auto" />
            </EditSettings>
        </DxGridDataColumn>
    </Columns>
</DxGrid>

@code {
    NorthwindContext Northwind { get; set; }
    List<Employee> Employees { get; set; }

    protected override async Task OnInitializedAsync() {
        Northwind = NorthwindContextFactory.CreateDbContext();
        Employees = await Northwind.Employees.ToListAsync();
    }

    public void Dispose() {
        Northwind?.Dispose();
    }
}

csharp

using Microsoft.EntityFrameworkCore;
#nullable disable

namespace Grid.Northwind {
    public partial class NorthwindContext : DbContext {

        public NorthwindContext(DbContextOptions<NorthwindContext> options)
            : base(options) {
        }
        // ...
        public virtual DbSet<Employee> Employees { get; set; }
        // ...
        protected override void OnConfiguring(DbContextOptionsBuilder optionsBuilder) {
            if(!optionsBuilder.IsConfigured) {
                optionsBuilder.UseSqlServer("Server=.\\sqlexpress;Database=Northwind;Integrated Security=true");
            }
        }

        protected override void OnModelCreating(ModelBuilder modelBuilder) {
            modelBuilder.HasAnnotation("Relational:Collation", "SQL_Latin1_General_CP1_CI_AS");
            // ...
            modelBuilder.Entity<Employee>(entity => {
                entity.HasIndex(e => e.EmployeeId, "EmployeeId");
                entity.HasIndex(e => e.LastName, "LastName");
                entity.HasIndex(e => e.FirstName, "FirstName");
                entity.HasIndex(e => e.Title, "Title");
                entity.HasIndex(e => e.BirthDate, "BirthDate");
                entity.HasIndex(e => e.HireDate, "HireDate");
                entity.HasIndex(e => e.Notes, "Notes");
            });
            // ...
            OnModelCreatingPartial(modelBuilder);
        }

        partial void OnModelCreatingPartial(ModelBuilder modelBuilder);
    }
}

csharp

public partial class Employee {
        public int EmployeeId { get; set; }
        public string LastName { get; set; }
        public string FirstName { get; set; }
        public string Title { get; set; }
        public string TitleOfCourtesy { get; set; }
        public Nullable BirthDate { get; set; }
        public Nullable HireDate { get; set; }
        public string Address { get; set; }
        public string City { get; set; }
        public string Region { get; set; }
        public string PostalCode { get; set; }
        public string Country { get; set; }
        public string HomePhone { get; set; }
        public string Extension { get; set; }
        public byte[] Photo { get; set; }
        public string Notes { get; set; }
        public Nullable<int> ReportsTo { get; set; }
        public string PhotoPath { get; set; }
        public virtual ICollection<Order> Orders { get; set; }
        public string Text => $"{FirstName} {LastName} ({Title})";
        public string ImageFileName => $"Employees/{EmployeeId}.jpg";
    }

Implements

EditSettings

Footnotes

The Grid replaces a checkbox editor with a combo box in the filter row.