ASP.NET Core中下拉框值查库及解决[object Object]显示问题

问题背景 #

在ASP.NET Core项目中，通过下拉框选择学生姓名，期望借助Entity Framework Core和JsonResult查询对应学生的Amount并显示在输入框中，但输入框始终显示[object Object]。Student表包含ID、StudentName、Amount三个字段，下拉框展示StudentName。

修正步骤 #

1. 后端JsonResult代码修正

原代码返回的是IQueryable集合（数组形式），前端接收到的是对象数组，直接赋值会显示[object Object]。修改为返回单个学生的Amount值：

[HttpPost]
public JsonResult StudentAmt(int id)
{
    // 查询对应ID的学生，获取单个对象
    var student = _context.Student.FirstOrDefault(p => p.ID == id);
    
    // 返回Amount，未找到则返回null
    return Json(student?.Amount);
}

2. 前端jQuery代码修正

原代码存在两个问题：一是选择器$('#amount)缺少闭合双引号；二是直接将对象赋值给输入框。同时优化参数传递方式，避免URL拼接：

<script>
$(function () {
    $("#studentname").change(function () {
        var struId = $(this).val();
        if (struId !== "") {
            $.ajax({
                type: "POST",
                url: "/Biodata/StudentAmt",
                data: { id: struId },
                success: function (response) {
                    $('#amount').val(response ?? '');
                }
            });
        } else {
            $('#amount').val('');
        }
    });
});
</script>

3. View代码验证

确保下拉框的asp-items是正确构造的SelectList，在Controller的Action中需绑定ID为值、StudentName为显示文本：

// 示例：在Controller的Get方法中赋值
public IActionResult YourAction()
{
    var model = new YourViewModel();
    model.Students = new SelectList(_context.Student.ToList(), "ID", "StudentName");
    return View(model);
}

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