Asp.net mvc 如何在隐藏字段中使用实体框架获取相关字段的值

我有一个模型Food，它有一个导航属性Vendor。我想在视图中查看相关的食品供应商，但我一直在视图中获取供应商属性的Id（编号）

这是我的模型：

    public class Food
    {
        public int Id { get; set; }

        [Display(Name = "Food Name")]
        public string Name { get; set; }

        public int VendorId { get; set; }

        public Vendor Vendor { get; set; }
    }

以下是我的供应商模型：

public class Vendor
    {
        public int Id { get; set; }

        [Display(Name = "Food Vendor")]
        public String FoodVendor { get; set; }

        public String Email { get; set; }
    }

以下是渲染我要显示的视图的控制器：

public ActionResult Index()
        {
            var orders = _context.Foods.Include(m => m.Vendor).ToList();
            var viewModel = new NewPlaceOrderViewModel()
            {
                Foods = orders
            };
            return View(viewModel);
        }

以下是我的ViewModel：

public class NewPlaceOrderViewModel
    {
        public IEnumerable<Food> Foods { get; set; }
        public Vendor Vendor { get; set; }
    }

---

我一直在获取现场的ID。也就是说，数字已经打印出来了。您会注意到隐藏字段的值是一个文本，其值为Tasty Fried Chicken为什么不能将文本字段作为文本获取？

您的代码将使用CSS类“el card item”为每个div中的2个隐藏输入元素生成HTML标记第一个包含食物Id的值，第二个包含文本字段（供应商名称）。因此，基本上表达式

最接近（.el card item”）.find（“input.vendor”）

将为您提供这两种输入。但是当调用

val（）

方法时，它将返回数组中第一项的值

我建议使用更具体的选择器。例如，您可以向隐藏元素添加css类

@Html.HiddenFor(m => food.Vendor.FoodVendor, for example,
                      new { id = "foodVendor" + counter.ToString(), @class="vendor" })

在jQuery代码中，使用这个css类作为选择器

$(".el-card-content").each(function ()
{
    var foodVendor = $(this).closest(".el-card-item").find("input.vendor").val();
    console.log(foodVendor);
})

---

我个人不喜欢仅仅为了jQuery选择而添加CSS类。我会考虑添加一个HTML5数据属性来将这个值存储到一个相关的DIV中，并使用<代码>数据< /代码>方法读取。< /P>您在哪里执行JavaScript的这行？在这个上下文中，

这个

是什么？我在点击事件中执行它。现在它根据你的答案工作。我很感激。

@Html.HiddenFor(m => food.Vendor.FoodVendor, for example,
                      new { id = "foodVendor" + counter.ToString(), @class="vendor" })

$(".el-card-content").each(function ()
{
    var foodVendor = $(this).closest(".el-card-item").find("input.vendor").val();
    console.log(foodVendor);
})