ASP.NET中如何从SelectList控件获取多选选中值？

当前使用多选SelectList控件时，后端只能拿到单个选中值，问题核心在于**Colors属性是单个字符串类型，且通过Request.Query["Colors"]手动取值仅会返回第一个参数值**。以下是问题代码及修复方案：

前端表单代码 #

<form asp-page="./index" method="get">
     <select asp-for="Colors" asp-items="@Model.Colors_SELECT" class="MultiSelect" multiple>
        <option value="">All</option>
    </select>
</form>

示例请求URL #

https://localhost:7221/Index?Colors=&Colors=red&Colors=blue

原后端代码 #

[BindProperty(SupportsGet = true)]
public string? Colors { get; set; }
public SelectList? Colors_SELECT { get; set; }

public async Task OnGetAsync()
{
       // 填充下拉选项
       Colors_SELECT = new SelectList(_services.Fill_Colors(), "Value", "Text", 1);
  
    // 错误的取值方式
    Colors = Request.Query["Colors"];
}

填充颜色的辅助函数 #

public List<SelectListItem> Fill_Colors()
{
    List<SelectListItem> Query = new List<SelectListItem>
    {
        new SelectListItem() { Value = "Black", Text = "blk" },
        new SelectListItem() { Value = "red", Text = "red" },
        new SelectListItem() { Value = "blue", Text = "blue" }
    };

    return Query;
}

修复方案 #

1. 修改后端属性类型 #

多选控件提交的是多个同名参数，必须用集合类型接收，将Colors改为List<string>或string[]：

[BindProperty(SupportsGet = true)]
public List<string>? Colors { get; set; }

2. 移除手动取值代码 #

[BindProperty(SupportsGet = true)]会自动将Query中所有Colors参数绑定到集合属性，删除以下无效代码：

// 移除此行
Colors = Request.Query["Colors"];

3. 验证绑定结果 #

修改后，Colors集合会自动包含所有选中值（比如选中red和blue时，集合内会有"red"、"blue"两个元素）。

修复后的完整后端代码 #

[BindProperty(SupportsGet = true)]
public List<string>? Colors { get; set; }
public SelectList? Colors_SELECT { get; set; }

public async Task OnGetAsync()
{
       // 填充下拉选项
       Colors_SELECT = new SelectList(_services.Fill_Colors(), "Value", "Text", 1);
  
    // 无需手动赋值，BindProperty已自动绑定选中值
}

内容的提问来源于stack exchange，提问作者dave