DxDropDownListEditorBase<TData, TValue>.KeyFieldName Property

Specifies the field name that contains unique identifiers for component items.

Namespace: DevExpress.Blazor.Base

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[DefaultValue("")]
[Parameter]
public string KeyFieldName { get; set; }

Property Value

Type	Default	Description
String	String.Empty	The key field’s name.

Remarks

Note

The KeyFieldName property was introduced in v24.1.6.

When the ComboBox/TagBox works with business objects, we recommend that you set the KeyFieldName property. If your data objects have a compound key, use the KeyFieldNames property instead. The component uses specified key fields to identify and compare data items.

Set the KeyFieldName/KeyFieldNames property in the following cases:

• When you use the CustomData property to bind the component to data stored on a remote service and loaded through a Web API.
• When you use the Data property to bind the component to a data collection (Data) that stores business objects (IEnumerable<CustomType>) and you specify a business object in the Value property.

If you do not specify key fields, the ComboBox/TagBox uses standard .NET value equality comparison to identify and compare data items. In this case, you should override object type’s Equals and GetHashCode methods to ensure correct identification of objects. However, the best way to identify objects is to use KeyFieldName and KeyFieldNames properties.

The following code specifies the ProductId field as a key.

Razor

@using Microsoft.EntityFrameworkCore
@inject IDbContextFactory<NorthwindContext> NorthwindContextFactory
@implements IDisposable

<DxComboBox Data="DataSource"
           @bind-Value="@Value"
           KeyFieldName="ProductId">
    <Columns>
        <DxListEditorColumn FieldName="ProductName" />
        <DxListEditorColumn FieldName="UnitPrice" />
        <DxListEditorColumn FieldName="QuantityPerUnit" />
        <DxListEditorColumn FieldName="UnitsInStock" />
    </Columns>
</DxComboBox>

@code {
    IEnumerable<object> DataSource { get; set; }
    NorthwindContext Northwind { get; set; }
    Product Value { get; set; }

    protected override void OnInitialized() {
        Northwind = NorthwindContextFactory.CreateDbContext();
        DataSource = Northwind.Products
            .ToList();
    }

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

Product

using System;
using System.Collections.Generic;

#nullable disable

namespace Grid.Northwind {
    public partial class Product {
        public Product() {
            OrderDetails = new HashSet<OrderDetail>();
        }

        public int ProductId { get; set; }
        public string ProductName { get; set; }
        public int? SupplierId { get; set; }
        public int? CategoryId { get; set; }
        public string QuantityPerUnit { get; set; }
        public decimal? UnitPrice { get; set; }
        public short? UnitsInStock { get; set; }
        public short? UnitsOnOrder { get; set; }
        public short? ReorderLevel { get; set; }
        public bool Discontinued { get; set; }

        public virtual Category Category { get; set; }
        public virtual Supplier Supplier { get; set; }
        public virtual ICollection<OrderDetail> OrderDetails { get; set; }
    }
}

NorthwindContext

using Microsoft.EntityFrameworkCore;
#nullable disable

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

        public NorthwindContext(DbContextOptions<NorthwindContext> options)
            : base(options) {
        }
        // ...
        public virtual DbSet<Product> Products { 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.Entity<Product>(entity => {
                entity.HasIndex(e => e.CategoryId, "CategoriesProducts");
                entity.HasIndex(e => e.CategoryId, "CategoryID");
                entity.HasIndex(e => e.ProductName, "ProductName");
                entity.HasIndex(e => e.SupplierId, "SupplierID");
                entity.HasIndex(e => e.SupplierId, "SuppliersProducts");
                entity.Property(e => e.ProductId).HasColumnName("ProductID");
                entity.Property(e => e.CategoryId).HasColumnName("CategoryID");
                entity.Property(e => e.ProductName)
                    .IsRequired()
                    .HasMaxLength(40);
                entity.Property(e => e.QuantityPerUnit).HasMaxLength(20);
                entity.Property(e => e.ReorderLevel).HasDefaultValueSql("((0))");
                entity.Property(e => e.SupplierId).HasColumnName("SupplierID");
                entity.Property(e => e.UnitPrice)
                    .HasColumnType("money")
                    .HasDefaultValueSql("((0))");
                entity.Property(e => e.UnitsInStock).HasDefaultValueSql("((0))");
                entity.Property(e => e.UnitsOnOrder).HasDefaultValueSql("((0))");
                entity.HasOne(d => d.Category)
                    .WithMany(p => p.Products)
                    .HasForeignKey(d => d.CategoryId)
                    .HasConstraintName("FK_Products_Categories");
                entity.HasOne(d => d.Supplier)
                    .WithMany(p => p.Products)
                    .HasForeignKey(d => d.SupplierId)
                    .HasConstraintName("FK_Products_Suppliers");
            });
            // ...
            OnModelCreatingPartial(modelBuilder);
        }

        partial void OnModelCreatingPartial(ModelBuilder modelBuilder);
    }
}

Program.cs

using Microsoft.EntityFrameworkCore;
// ...
builder.Services.AddDbContextFactory<NorthwindContext>((sp, options) => {
    var env = sp.GetRequiredService<IWebHostEnvironment>();
    var dbPath = Path.Combine(env.ContentRootPath, "Northwind-5e44b51f.mdf");
    options.UseSqlServer("Server=(localdb)\\MSSQLLocalDB;Integrated Security=true;AttachDbFileName=" + dbPath);
});

Implements

DevExpress.Blazor.IListEditorBase<TData, TValue>.KeyFieldName