BlazorDatasheet Cell 에 Combo 데이터 표시하기

BlazorDatasheet Cell 에 Combo 데이터 표시하기

 

BlazorDatasheet 에서 Cell 에 combo 데이터를 표시하기 위해서는 SourceValidator 를 이용하여 sheet.Validators 에 추가하고 CellType 을 "select" 로 저장하면 됩니다.

아래처럼 원하는 컬럼에 아래처럼 처리하면 됩니다.

// 콤보에 사용될 데이터
var names = new SourceValidator(new List<string> { "Laptop", "Keyboard", "Mouse" }, false);
// 첫 번째 컬럼의 모든 셀을 "select" 타입으로 변경
sheet.Cells.SetType(new ColumnRegion(0), "select");
// 해당 컬럼에 SourceValidator 추가
sheet.Validators.Add(new ColumnRegion(0), names);

콤보에 사용될 데이터를 SourceValidator 를 이용해 정의하고 마지막 인자 isStrict 는

true : 콤보데이터만 허용하여 직접 입력을 막음

false : 콤보데이터 이외의 데이터를 허용하여 직접 입력이 허용됨

화면에서는 아래와 같이 사용합니다.

@page "/counter"
@using BlazorDatasheet.Core.Validation
@using BlazorDatasheet.Edit.DefaultComponents
@using BlazorDatasheet.Render

@rendermode InteractiveServer

<PageTitle>Home</PageTitle>

<Datasheet Sheet="sheet" CustomCellTypeDefinitions="CustomTypes" />
<br />
<br />

@code {
    private Sheet sheet = new Sheet(0, 0);
    private Dictionary<string, CellTypeDefinition> CustomTypes { get; } = new();

    protected override void OnInitialized()
    {
        // button type 추가
        CustomTypes.Add("button", CellTypeDefinition.Create<TextEditorComponent, ButtonRenderer>());
        base.OnInitialized();
    }

    protected override void OnAfterRender(bool firstRender)
    {
        if (firstRender)
        {
            TestBinding();
            StateHasChanged();
        }

        base.OnAfterRender(firstRender);
    }

    private void TestBinding()
    {
        sheet.ScreenUpdating = false;
        sheet.Commands.PauseHistory();
        sheet.BatchUpdates();

        sheet = new Sheet(0, 0);

        // 제품 데이터 리스트
        List<Product> products = new List<Product>
        {
            new Product { Name = "Laptop", Price = 1200, Quantity = 5 },
            new Product { Name = "Keyboard", Price = 50, Quantity = 20 },
            new Product { Name = "Mouse", Price = 30, Quantity = 15 }
        };

        sheet = new Sheet(products.Count, typeof(Product).GetProperties().Count());

        // 데이터를 object[][] 배열로 변환
        object[][] values = products
            .Select(p => new object[] { p.Name, p.Price, p.Quantity })
            .ToArray();

        sheet.Cells.SetValues(0, 0, values);

        // 콤보에 사용될 데이터
        var names = new SourceValidator(new List<string> { "Laptop", "Keyboard", "Mouse" }, false);
        // 첫 번째 컬럼의 모든 셀을 "select" 타입으로 변경
        sheet.Cells.SetType(new ColumnRegion(0), "select");
        // 해당 컬럼에 SourceValidator 추가
        sheet.Validators.Add(new ColumnRegion(0), names);

        // button
        sheet.Cells.SetType(new ColumnRegion(1), "button");

        sheet.EndBatchUpdates();
        sheet.Commands.ResumeHistory();
        sheet.ScreenUpdating = true;
    }

    private class Product
    {
        public string? Name { get; set; }
        public double Price { get; set; }
        public int Quantity { get; set; }
    }
}

 

결과