DropDownListFor无法选中值并更新模型SelectedItem属性的问题

云原生阿岚

2026-8-5

问题解决方法

核心问题分析

你遇到的问题根源有两个：

提交按钮的asp-route-itemId="@Model.SelectedItem"是页面渲染时的初始值，不会随着下拉框的选择动态更新，所以提交时传的始终是页面加载时的SelectedItem值，而非选中项。
调试用的<div>@Model.SelectedItem</div>同样只显示页面初始化时的模型值，不会实时同步下拉框的选中状态。

具体修复步骤

1. 修正提交按钮的路由参数

删掉asp-route-itemId="@Model.SelectedItem"，让表单通过POST请求自动提交下拉框的选中值。DropDownListFor生成的<select>标签会自动绑定到SelectedItem属性，表单提交时框架会自动完成参数绑定。

修改后的提交按钮代码：

<input type="submit" value="Do Stuff" 
        asp-controller="My" 
        asp-action="DoStuff" />

2. 确保控制器Action正确接收参数

如果使用视图模型绑定，Action应接收你的ViewModel类；也可以直接接收SelectedItem参数：

// 方式1：接收视图模型
[HttpPost]
public IActionResult DoStuff(YourViewModel model)
{
    // model.SelectedItem 即为下拉框选中的Id
    // 业务逻辑处理
    return View(model);
}

// 方式2：直接接收参数
[HttpPost]
public IActionResult DoStuff(int selectedItem)
{
    // 使用selectedItem处理逻辑
    return View();
}

3. 实时显示选中值（可选）

如果需要调试时实时看到选中值，添加JavaScript同步更新div内容：

<div id="selected-value">@Model.SelectedItem</div>

<script>
document.querySelector('.selected-list').addEventListener('change', function() {
    document.getElementById('selected-value').textContent = this.value;
});
</script>