ASP.NET MVC Core：点击列表按钮时如何获取选中项的索引

这问题很好解决，咱们只需要在渲染按钮时把循环的索引值存到按钮的自定义data-*属性里，点击时读取这个值再传给控制器就行，具体步骤如下：

1. 给按钮添加存储索引的data属性 #

在你的for循环里，把当前迭代的索引i绑定到按钮的data-index属性上：

<form asp-action="Test">
@for (int i = 0; i < Model.Count(); i++) {
    var buttonid = "btnSubmit" + i;
    @Html.TextBoxFor(model => Model[i].Name)
    @Html.TextBoxFor(model => Model[i].ClassName)
    <!-- 新增data-index="@i"来存储当前项的索引 -->
    <input name="submit" id="@buttonid" type="button" data-classid="@Model[i].ClassID" data-index="@i" value="Go to class Form" class="btn btn-default MyButtonClass" style="font-size: 14px" />
}
<script>
$(document).on("click", ".MyButtonClass", function () {
    var id = $(this).data("classid");
    var selectedIndex = $(this).data("index"); // 读取按钮上存储的索引
    alert(`ClassID: ${id}, 选中项索引: ${selectedIndex}`);
    $.ajax({
        type: "POST",
        url: "/StudentController/Test",
        data: { classid: id, index: selectedIndex } // 将索引和ClassID一起传给后端
    });
});
</script>
</form>

2. 更新控制器接收索引参数 #

修改你的Test方法，新增index参数来接收前端传过来的索引值：

[HttpPost]
public IActionResult Test(int classid, int index) { 
    // 这里就能直接拿到点击项的索引index了
    // 你可以用这个索引从Model列表中定位到对应的项
    return View(); 
}

额外说明 #

• 循环里的i本身就是当前项在Model列表中的索引，直接绑定到data属性是最靠谱的方式，不需要额外计算。
• 如果你的需求只需要在前端处理索引，不用传到后端，那直接在点击事件里用selectedIndex做逻辑就可以了。

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