ASP.Net 5 Core MVC提交按钮向控制器发送空白数据问题求助

问题原因 #

• 表单元素缺少name属性：ASP.NET Core MVC的表单提交绑定靠元素name属性和控制器参数名匹配，你现有的隐藏输入框、下拉选择框都没有设置name，后端无法识别接收到的字段。
• 全局表单包含所有行数据：整个表格共用一个表单，点击任意行的提交按钮会提交所有行的输入项，参数名重复导致后端无法正确取值。
• 控制器参数设计不合理：你需要传递用户ID、新角色两个字段，仅设置一个data参数无法接收两个值，也和前端提交的字段名不匹配。

解决方案 #

步骤1：修改视图代码 #

取消全局表单，改为每行对应一个独立表单，给提交字段设置正确的name属性，同时可以删掉多余的隐藏输入框和change监听JS，直接用下拉框本身提交值：

<table class="table">
    <thead>
        <tr>
            <th>Email</th>
            <th>Role</th>
            <th>操作</th>
        </tr>
    </thead>
    <tbody>
    @if (Model != null)
    {
        foreach (var item in Model)
        {
            <tr>
                <td>@item.Key</td>
                <td>
                    @* 每行单独绑定表单，仅提交当前行数据 *@
                    @using (Html.BeginForm("SuperAdminEdit", "Referral", FormMethod.Post))
                    {
                        @* 隐藏域存用户ID，name和控制器参数对应 *@
                        <input type="hidden" name="userId" value="@item.Key" />
                        @* 下拉框设置name属性，直接提交选中值，无需额外JS *@
                        <select name="newRole" class="form-control">
                            @{
                                string[] roles = { "User", "Admin", "Super Admin" };
                                foreach (var role in roles)
                                {
                                    <option selected="@role.Equals(item.Value)">@role</option>
                                }
                            }
                        </select>
                </td>
                <td>
                    <input type="submit" value="Update" class="btn btn-primary" />
                    } @* 表单闭合在按钮之后 *@
                </td>
            </tr>
        }
    }
    </tbody>
</table>

步骤2：修改控制器代码 #

调整参数名和前端表单name属性对应，完成更新后重定向到列表页返回最新数据：

[HttpPost]
public ActionResult SuperAdminEdit(string userId, string newRole)
{
    Console.WriteLine($"要更新的用户ID：{userId}，新角色：{newRole}");
    // 此处保留你的数据库更新逻辑
    SqlConnection conn = new SqlConnection(/*你的连接字符串*/);
    conn.Open();
    // ... 执行更新逻辑

    // 更新完成后重定向到用户列表页，返回最新视图
    return RedirectToAction("你的用户列表页对应的Action名称");
}

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