[Solved] TelerikMultiColumnComboBox Virtualization with API Call

0 Answers 7 Views
MultiColumnComboBox
Erik
Top achievements
Rank 1
Erik asked on 09 Apr 2026, 05:23 PM
I am trying to leverage the TelerikMultiColumnComboBox  to tie into my API calls against a large dataset to return to the user results that match the filterString they are entering. Below is a reduced sample of what I am trying to achieve and what my current implementation is. The issue I am having is that when I hit the bottom, or scroll in the comboBox, the component calls OnRead for page 1 again and doesnt go to page 2, etc. I have validated this by console logging what the parameters are within OnRead but am struggling to figure out why it is not going to the next page. Any help would be appreciated. Thanks in advance!
@page "/Test"

@using Telerik.Blazor.Components
@inject PreAwardJobSetupService preAwardSvr

<TelerikMultiColumnComboBox TItem="Estimate"
                            TValue="Guid?"
                            TextField="Display"
                            ValueField="Id"
                            @bind-Value="SelectedEstimateId"
                            Filterable="true"
                            ScrollMode="DropDownScrollMode.Virtual"
                            PageSize="@PageSize"
                            OnRead="@OnEstimateLookup"
                            Width="100%"
                            ItemHeight="@ItemHeight"
                            ListHeight="@ListHeight">
    <MultiColumnComboBoxColumns>
        <MultiColumnComboBoxColumn Field="Revision" Title="Revision" Width="80px" />
        <MultiColumnComboBoxColumn Field="RevisionName" Title="RevisionName" Width="200px" />
        <MultiColumnComboBoxColumn Field="Opportunity_Title" Title="Opportunity Title" Width="200px" />
        <MultiColumnComboBoxColumn Field="Customer_Name" Title="Customer" Width="200px" />
        <MultiColumnComboBoxColumn Field="ApprovalStatus" Title="Approval Status" Width="100px" />
        <MultiColumnComboBoxColumn Field="OppStatus" Title="Opp Status" Width="100px" />
    </MultiColumnComboBoxColumns>
</TelerikMultiColumnComboBox>

@code {
    private Guid? SelectedEstimateId { get; set; }
    public string ListHeight { get; set; } = "268px";
    public int ItemHeight { get; set; } = 28;
    public int PageSize { get; set; } = 50;

    private async Task OnEstimateLookup(MultiColumnComboBoxReadEventArgs args)
    {
        string? filter = args.Request?.Filters?.OfType<Telerik.DataSource.FilterDescriptor>().FirstOrDefault()?.Value as string;

        if (string.IsNullOrWhiteSpace(filter))
        {
            args.Data = new List<Estimate>();
            args.Total = 0;
            return;
        }

        int page = args.Request?.Page ?? 1;
        int pageSize = args.Request?.PageSize ?? PageSize;

        var result = await preAwardSvr.GetEstimatesPagedAsync(filter, page, pageSize);

        args.Data = result.Estimates;
        args.Total = result.TotalCount;
    }
}

No answers yet. Maybe you can help?

Tags
MultiColumnComboBox
Asked by
Erik
Top achievements
Rank 1
Share this question
or