ASP.NET MVC中select下拉框的asp路由属性不生效如何解决？

问题根本原因 #

ASP.NET Core 内置的 Tag Helper 仅对 <a>、<form>、<button> 等特定标签支持 asp-controller、asp-action 这类路由相关属性，直接写在 <option> 标签上的这类属性不会被解析处理，渲染到浏览器端后这些属性会被直接忽略，自然无法触发跳转。
之前你把select放到form里依旧无效，是因为没有配置form和select的对应参数关联，提交时识别不到要传递的路由值。

解决方案1：无需form，前端监听跳转 #

先通过 Url.Action 生成每个选项对应的跳转地址存入value，监听select的change事件触发跳转即可：

<select id="categorySelect">
    <option value="@Url.Action("Catalog", "Home", new { id = 1 })">Fish</option>
    <option value="@Url.Action("Catalog", "Home", new { id = 2 })">Rodent</option>
</select>

<script>
document.getElementById('categorySelect').addEventListener('change', function() {
    if (this.value) window.location.href = this.value;
});
</script>

解决方案2：Form提交实现 #

如果要通过表单提交实现，将路由属性配置在form标签上，给select设置name为对应的路由参数名id即可：

<form asp-controller="Home" asp-action="Catalog" method="get">
    <select name="id">
        <option value="1">Fish</option>
        <option value="2">Rodent</option>
    </select>
    <button type="submit">切换分类</button>
</form>

提交后会自动拼接参数为 /Home/Catalog?id=选中值，符合你的路由要求。

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