提问人:MelB 提问时间:6/11/2022 最后编辑:Timothy G.MelB 更新时间:6/15/2022 访问量:3598
将 Razor 页面上的下拉列表绑定到数据库表
Binding Dropdown list on Razor Page to Database Table
问:
我是剃须刀页面、asp.net 和 Visual Studio 的绝对初学者。我按照 asp.net 和剃须刀页面上的精彩教程开始使用 YouTube。
然而,现在我被困住了。我正在尝试做什么:
我有一个页面 Create.cshtml,用户在其中输入数据并将其发布到数据库表 (InfoSite)。这效果很好,但我想为其中一个字段创建一个下拉列表。我可以在下拉列表中创建一个静态列表,但我想创建一个基于另一个数据库表 (ResCategory) 中的值的下拉列表,以便用户可以在需要时更新这些 ResCategory 值,然后它们将自动显示在下拉列表中。
我现在有一部分工作。Create.cshtml 页面上的下拉列表将读取 ResCategory 表中的值,但当我单击“提交”按钮添加该记录时,它不会将下拉框选择发布/绑定到 InfoSite 表。不过,它会发布/绑定该页面中的所有其他内容。
很可能,我错过了一些简单的东西,但就是无法弄清楚是什么。我现在最大的问题之一是还不知道某些代码需要“去哪里”!
这是我到目前为止所拥有的:
在 Create.cshtml 页面上,我有以下代码:
<select id="ResType" asp-items="@(new SelectList(Model.displayResCatdata,"ID","Description"))" class="form-select">
<option value="" selected disabled>---Select Residence Type---</option>
</select>
在 Create.cshtml.cs 上,我有这个:
public IEnumerable<ResCategory> displayResCatdata { get; set; }
public async Task OnGet()
{
displayResCatdata = await _db.ResCategory.ToListAsync();
}
public async Task<IActionResult> OnPost()
{
await _db.InfoSite.AddAsync(InfoSite);
await _db.SaveChangesAsync();
TempData["success"] = "Site Information added successfully.";
return RedirectToPage("Index");
}
然后,在我的InfoSite.cs上,我有:
public class InfoSite
{
[Key]
public int ID { get; set; }
[Required]
public string Name { get; set; }
[Display(Name = "Office Type")]
public string? Specialty { get; set; }
[Display(Name = "Res Type")]
public string? ResType { get; set; }
[Display(Name = "Res Sub Type")]
public string? ResSubType { get; set; }.....
我确定我不应该把“公共字符串?对于 Res Type { get; set; },但我不确定该使用什么。另外,我认为其他地方一定有什么不对劲。
有人可以就我可能遗漏的内容以及我可能遗漏的确切位置给出具体指示吗?
答:
您没有将数据传递到控制器中的方法。
解决方案:
public async Task<IActionResult> OnPost(InfoSite InfoSite)
{
await _db.InfoSite.AddAsync(InfoSite);
await _db.SaveChangesAsync();
TempData["success"] = "Site Information added successfully.";
return RedirectToPage("Index");
}
或
public IActionResult OnPost()
{
var infoSite = new InfoSite();
return this.View(infoSite);
}
public async Task<IActionResult> OnPost(InfoSite InfoSite)
{
await _db.InfoSite.AddAsync(InfoSite);
await _db.SaveChangesAsync();
TempData["success"] = "Site Information added successfully.";
return RedirectToPage("Index");
}
评论
经过反复试验,阅读,阅读,阅读,我回答了自己的问题。
实际上,缺少的是我的 Create.cshtml 页面上的一件小事。
我缺少“asp-for”以绑定所选选项。所以,而不是:
<select id="ResType" asp-items="@(new SelectList(Model.displayResCatdata,"ID","Description"))" class="form-select">
<option value="" selected disabled>---Select Residence Type---</option>
</select>
我应该有:
<select asp-for="InfoSite.ResType" id="Select1" class="form-select" asp-items="@(new SelectList(Model.DisplayResCatData,"ID", "Description"))"><option value="" selected disabled>---Select Residence Type---</option></select>
我唯一剩下的问题是,即使 ID 被绑定,我也希望能够绑定描述,因为这是我真正想要的 InfoSite 表,但至少它是绑定的。这将是另一个线程的问题!
评论
select
<select>
name
<select name="SomeModelPropertyName" id="ResType">