使用 MVC 中的复选框启用/禁用表单字段

问题描述

在我的表单 asp net MVC c# 上，我有这些字段：

• True/False 作为复选框
• A 需要 TextBoxFor 值
• B 作为 TextAreaFor 值不需要

当复选框 True/False 被选中时我需要：

• A 值 >>> 不需要并禁用此字段
• B 值 >>> 必需

你能帮我吗？

我的代码如下

<div class="row">
    <div class="col-md-12">
        <div class="form-group" style="background-color: lightgoldenrodyellow; border:3px solid; font-weight:bold;">
            <h5 style="font-weight: bold; text-indent: 20px;">
                True/False @Html.CheckBoxFor(m => m.Truefalse,true)
            </h5>
        </div>
    </div>
</div>
<div class="row">
    <div class="col-md-3">
        <div class="form-group">
            @Html.LabelFor(m => m.A)
            @Html.TextBoxFor(m => m.A,"{0:dd/MM/yyyy}",new { @Class = "Mytextarea2",placeholder = "A" })
            @Html.ValidationMessageFor(m => m.A,"",new { @class = "text-danger" })
        </div>
    </div>
</div>
<div class="row">
    <div class="col-md-3">
        <div class="form-group">
            @Html.LabelFor(m => m.B)
            @Html.TextAreaFor(m => m.B,new { style = "width: 420px; height: 100px;",placeholder = "B" })
        </div>
    </div>
</div>

解决方法

在您的模型中，不要对字段 A 和 B 使用 [Required] 注释。

在js中，为复选框添加一个onchange事件。此代码应启用/禁用 A/B。

在提交表单时调用 js 时，编写一些前端验证代码来检查框的状态以及 A/B 文本框是否有效。

最后，注意服务器端验证。您可以在那里检查模型的状态，并添加您在前端验证中编写的类似逻辑。

,

在 Javascript 中，在复选框的更改方法上，您可以只检查天气复选框是否为真，如果复选框值为真，则在要禁用的字段中添加禁用属性，否则使用该字段删除禁用属性。