asp.net-core - 将我的复选框更改为我的 asp.net 核心 mvc 中的 2 个单选按钮（是和否）

Question

我的 asp.net core mvc 中有以下代码来显示一个复选框，如下所示：-

@for (var i = 0; i < Model.SubmissionQuestion.Count(); i++)
     {

       <div class="form-group form-check">
       <input type="checkbox" asp-for="@Model.SubmissionQuestionSubmission[i].Answer" class="form-check-input" />  <label class="form-check-label">@Model.SubmissionQuestion[i].Question</label>
                        
       </div>
     }

但我想将此复选框转换为 2 个单选按钮（是和否），那我该怎么办？谢谢

标签： asp.net-coreasp.net-core-mvc

Answer 1

根据您的描述，我建议您可以尝试使用bootstrap 的收音机来满足您的要求。

您可以使用 form-check-inline 并让 yes 和 no 单选按钮进入同一行并设置其值。

更多细节，您可以参考以下代码：

    @for (var i = 0; i < Model.SubmissionQuestion.Count(); i++)
     {

<div class="form-group">
    <label class="labeltext">@Model.SubmissionQuestion[i].Question</label>

    <div class="form-check form-check-inline">
        <input class="form-check-input" type="radio" asp-for="@Model.SubmissionQuestionSubmission[i].Answer" id="inlineRadio1" value="true">
        <label class="form-check-label" for="inlineRadio1">Yes</label>
    </div>
    <div class="form-check form-check-inline">
        <input class="form-check-input" type="radio" asp-for="@Model.SubmissionQuestionSubmission[i].Answer" id="inlineRadio2" value="false">
        <label class="form-check-label" for="inlineRadio2">No</label>
    </div>
</div>
 }
}

结果：