【问题标题】:Can't select a Radio button in a Razor page无法在 Razor 页面中选择单选按钮
【发布时间】:2020-02-25 17:29:35
【问题描述】:

我有一个带有 2 个单选按钮的剃须刀页面。但我无法检查其中之一...

<div class="custom-control custom-radio">
    <input type="radio" asp-for="@Model.ActionNeeded" value="Yes" class="custom-control-input"  name="radio-stacked" required>
    <label class="custom-control-label">Yes</label>
</div>
<div class="custom-control custom-radio mb-3">
    <input type="radio" asp-for="@Model.ActionNeeded" value="No" class="custom-control-input"  name="radio-stacked" required>
    <label class="custom-control-label">No</label>
</div>

我错过了什么?这是一个简单的事情,但不能让它工作......

【问题讨论】:

  • 您的收音机没有值,添加一个值,看看您现在是否可以选择它们。
  • 我认为这是一个 CSS 问题。您的标签位于其他 div 下方或被其他 div 覆盖。检查laber或radio的css。
  • 它是从引导网站复制的
  • asp-for="@Model.ActionNeeded" 正在为两个无线电生成相同的 ID,为每个无线电创建不同的 ID。

标签: c# radio-button razor-pages asp.net-core-2.2


【解决方案1】:

asp-for="@Model.ActionNeeded" 正在为两个无线电生成相同的 id。

为每个收音机创建不同的 id 并在标签中添加for=""

<div class="custom-control custom-radio">
    <input type="radio" id="ActionYes" value="Yes" class="custom-control-input"  name="ActionNeeded" required>
    <label for="ActionYes" class="custom-control-label">Yes</label>
</div>
<div class="custom-control custom-radio mb-3">
    <input type="radio" id="ActionNo" value="No" class="custom-control-input"  name="ActionNeeded" required>
    <label for="ActionNo" class="custom-control-label">No</label>
</div>

【讨论】:

  • @user7849697 我相信模型绑定器使用 name 属性自动将 html 映射到属性。你能检查name="ActionNeeded"现在是否有效吗?
【解决方案2】:

你有两个按钮同名,这会让你失去它们的价值:

name="radio-stacked"

【讨论】:

  • 我删除了名称但仍然无法选择 RadioButton
  • 你要为每一个输入一个不同的名字,或者如果你不输入,你必须寻找生成的名字。
  • 添加了名称但仍然无法选择 RadioButton :D
  • 电台必须同名才能被视为一个组
  • 如果你想将它们创建为一个组,你必须在每个组中添加不同的值
猜你喜欢
  • 2021-12-03
  • 2020-12-10
  • 2018-09-17
  • 2018-07-08
  • 1970-01-01
  • 2019-10-17
  • 1970-01-01
相关资源
最近更新 更多