Reply To: Seeking input on: Table. Thanks!

[Markov]

To implement custom filtering in Smart.Table using Blazor, you can use the Filterable property along with custom logic in C# to control how data is filtered. Here’s a step-by-step example.

<Table DataSource="@FilteredData"
             Filterable="true"
             Columns="@Columns">
</Table>

Define your columns:

@code {
    private List<TableColumn> Columns = new List<TableColumn>
    {
        new TableColumn { Label = "ID", DataField = "Id" },
        new TableColumn { Label = "Name", DataField = "Name" },
        new TableColumn { Label = "Status", DataField = "Status" }
    };

Setup the filtering:

 private List<Item> AllItems = new List<Item>
    {
        new Item { Id = 1, Name = "Task A", Status = "Open" },
        new Item { Id = 2, Name = "Task B", Status = "Closed" },
        new Item { Id = 3, Name = "Task C", Status = "In Progress" }
    };

    private List<Item> FilteredData = new List<Item>();

    private string filterText = "";

    protected override void OnInitialized()
    {
        FilteredData = AllItems;
    }

    private void OnFilterChanged(ChangeEventArgs e)
    {
        filterText = e.Value.ToString();
        ApplyCustomFilter();
    }

    private void ApplyCustomFilter()
    {
        if (string.IsNullOrWhiteSpace(filterText))
        {
            FilteredData = AllItems;
        }
        else
        {
            FilteredData = AllItems.Where(item =>
                item.Name.Contains(filterText, StringComparison.OrdinalIgnoreCase) ||
                item.Status.Contains(filterText, StringComparison.OrdinalIgnoreCase)).ToList();
        }
    }
}

Add a filter input

<input type="text" placeholder="Filter by name or status..." @oninput="OnFilterChanged" />

Best regards,
Markov

Smart UI Team
https://www.htmlelements.com/