Razor CRUD脚手架页面样式缺失及外键字段未生成问题求助

一、修复CRUD页面样式缺失问题 #

脚手架生成的页面默认依赖Bootstrap样式，按以下步骤排查修复：

• 检查_Layout.cshtml是否包含Bootstrap与jQuery的资源引用，示例代码如下：

  <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
  <script src="~/lib/jquery/dist/jquery.min.js"></script>
  <script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
  

• 确认项目wwwroot/lib目录下存在Bootstrap和jQuery文件，若缺失可通过LibMan工具下载对应资源，或通过NuGet安装Microsoft.AspNetCore.StaticFiles确保静态资源可被访问。
• 保证CRUD视图页面（如Create.cshtml、Edit.cshtml）顶部引用了布局页：

  @{
      Layout = "_Layout";
  }
  

二、解决外键关联字段未显示的问题 #

Product与Category的关联选项未在创建/编辑页显示，通常是以下原因及对应解决方法：

1. 脚手架生成未识别关联关系
   重新生成CRUD脚手架时，选择包含Category实体的DbContext，勾选"Generate views with a layout page"选项；同时确认Product模型的外键与导航属性定义正确：

   public class Product
   {
       public int Id { get; set; }
       public string Name { get; set; }
       // 必填外键属性
       public int CategoryId { get; set; }
       // 关联导航属性
       public Category Category { get; set; }
   }
   

2. 视图未添加下拉列表控件
   若重新生成无效，可手动添加：
   • 在Controller的Create/Edit方法中，将Category列表传递到视图：

     public IActionResult Create()
     {
         ViewData["CategoryId"] = new SelectList(_context.Categories, "Id", "Name");
         return View();
     }
     

   • 在视图中插入下拉选择控件：

     <div class="form-group">
         <label asp-for="CategoryId" class="control-label"></label>
         <select asp-for="CategoryId" class="form-control" asp-items="ViewBag.CategoryId"></select>
         <span asp-validation-for="CategoryId" class="text-danger"></span>
     </div>
     

3. DbContext关联配置缺失
   检查DbContext是否正确配置实体关联：

   protected override void OnModelCreating(ModelBuilder modelBuilder)
   {
       modelBuilder.Entity<Product>()
           .HasOne(p => p.Category)
           .WithMany(c => c.Products) // 对应Category中的Products导航属性
           .HasForeignKey(p => p.CategoryId)
           .IsRequired();
   }
   

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