如何使用 ASP.NET Core Razor 页面预选下拉列表中的项目

Posted

技术标签:

【中文标题】如何使用 ASP.NET Core Razor 页面预选下拉列表中的项目【英文标题】:How to preselect an item in a dropdown using ASP.NET Core Razor pages 【发布时间】:2019-02-01 12:57:18 【问题描述】:

如果有帮助,我们正在使用 ASP.NET Core 2.1 和 Razor 页面(不是传统的 MVC)

我在选择工作时遇到问题。我们正在使用SelectListItem 列表为我们的页面生成一个选项列表,该列表引入了枚举,我们将其放置在我们的asp-items 中,效果很棒。对于我们的 asp-for,我们使用了一个递增的标签,因为有几个下拉菜单的循环。

<select asp-for="@Model.Answers[answerOptionIndex].AnswerText" 
        asp-items="@Model.CriticalIllnessTierSelectListItems" 
        class="form-control">
    <option></option>
</select>

对于添加产品,这非常有用,asp-for 生成 Answers[0].AnswerText 用于名称,Answers_0__AnswerText 用于 id,这太棒了。

问题是我们需要能够编辑现有的表单,所以为了预先填充值,我发现你可以使用 asp-for,所以我输入 @answerTextForQuestion for asp-for 现在正确的选项是在页面加载时预先选择的......但它会弄乱我的 ID 和名称。

当我这样做时,我得到这个:

<select name="answerTextForQuestion" class="form-control" 
        id="answerTextForQuestion">

奇怪的是它没有把值answerTextForQuestion是,它只是把变量。

我尝试手动将名称和 ID 设置为 @Model.Answers[answerOptionIndex].AnswerText,并将 asp-for 保留为 @answerTextForQuestion,但它忽略了它并仍然输入 @answerTextForQuestion 来进行问答。

我不知道我的蛋糕怎么吃。我需要我的 asp-for 为 @Model.Answers[answerOptionIndex].AnswerText,但我也需要它来选择 @answerTextForQuestion 中的任何一个值。因为我们使用的是SelectListItem,所以我不能只在正确的属性上抛出一个选定的属性。

我发现了一个堆栈溢出,它试图使用一个循环,如果选中的项目匹配 answerTextForQuestion 然后使选中的属性为真,但这不起作用,我在 cmets 中读取了选中的只读,所以这行不通。我把它加粗是因为我担心它会因为重复帖子而被否决。

编辑:更好的标题可能是我可以使用另一个属性来告诉浏览器应该在不使用 ASP-FOR 的情况下预先选择哪个选项。我们有很多围绕 ASP-FOR 使用的名称和 ID 构建的 AJAX,但我只需要这个函数。我查看了 C# 文档,但什么也没看到。

【问题讨论】:

也许我没有抓住重点,但你不能把你想要预先选择的值放在选项标签中吗? (即 【参考方案1】:

对于下拉列表中的预选项目,您可以参考下面的简单示例的部分代码

1.在Edit.cshtml

<div class="form-group">
            <label asp-for="Movie.Genre" class="control-label"></label>
            <select  asp-for="Movie.Genre.Id" asp-items='(List<SelectListItem>)ViewData["Genres"]'></select>
        </div>

2.在Edit.cshtml.cs中

模型绑定

[BindProperty]
    public Movie Movie  get; set; 

    public Genre Genre  get; set; 

OnGetAsync()

 Movie = await _context.Movie
                     .Include(m => m.Genre)
                     .SingleOrDefaultAsync(m => m.Id == id);

 ViewData["Genres"] = _context.Genre.Select(g => new SelectListItem  Value = g.Id.ToString(), Text = g.Name ).ToList();

【讨论】:

我不确定这有什么帮助。它不预先选择任何选项。 asp-for 是预选选项的解决方案

以上是关于如何使用 ASP.NET Core Razor 页面预选下拉列表中的项目的主要内容,如果未能解决你的问题,请参考以下文章

在 Razor 视图中使用 Ajax 进行 Asp.Net Core 表分页

如何在 asp.net core .NET6(Razor 页面)中的单个 cshtml 中显示来自多个表/模型的数据

基于动作的重定向 ASP.Net Core Razor

[MVC&Core]ASP.NET Core MVC 视图传值入门

[MVC&Core]ASP.NET Core MVC 视图传值入门

如何使用 ASP.NET Core Razor 页面预选下拉列表中的项目