表单提交后如何检测复选框是否被选中（Blazor开发场景）

你的核心问题是复选框绑定的属性不对——现在你把复选框绑定到了forecast.Id（数值类型），但复选框需要绑定布尔值来标记是否选中。按以下步骤修改：

1. 给数据模型添加选中标记属性 #

假设你的数据模型是Sample，给它加一个布尔属性用来记录是否被选中：

public class Sample
{
    public int Id { get; set; }
    public string Title { get; set; }
    public string Description { get; set; }
    // 新增：标记是否选中的属性
    public bool IsSelected { get; set; }
}

2. 修正复选框的绑定逻辑 #

把HTML里的复选框绑定改成@forecast.IsSelected，同时给每个复选框设置唯一的id（避免页面元素id重复）：

<EditForm Model="@samples" OnValidSubmit="@HandleValidSubmit">
    <table class="table">
        <thead>
            <tr>
                <th>选择</th>
                <th>id</th>
                <th>Title</th>
                <th>Description</th>
            </tr>
        </thead>
        <tbody>
            @foreach (var forecast in samples)
            {
                <tr>
                    <!-- 绑定到IsSelected属性，id设为唯一值 -->
                    <td><input type="checkbox" id="delete-@forecast.Id" name="delete" bind="@forecast.IsSelected" /></td>
                    <td>@forecast.Id</td>
                    <td>@forecast.Title</td>
                    <td>@forecast.Description</td>
                </tr>
            }
            <tr>
                <td colspan="4">
                    <button type="submit">Delete selected</button>
                    <button @onclick=@Navigate>Add</button>
                </td>
            </tr>
        </tbody>
    </table>
</EditForm>

3. 在提交方法中筛选并删除选中项 #

修改HandleValidSubmit，先筛选出IsSelected为true的样本，再执行删除，最后更新界面绑定的列表：

private async Task HandleValidSubmit()
{
    using var context = DbFactory.CreateDbContext();
    
    // 筛选出被选中的样本
    var selectedSamples = samples.Where(s => s.IsSelected).ToList();
    
    foreach (var sample in selectedSamples)
    {
        context.Samples.Remove(sample);
        // 从界面绑定的列表中移除，更新UI显示
        samples.Remove(sample);
    }

    await context.SaveChangesAsync();
}

注意：把async void改成async Task，Blazor中事件处理方法推荐返回Task而非void，避免潜在的异常处理问题。

内容的提问来源于stack exchange，提问作者Linda Lawton - DaImTo