如何根据选择的单选按钮显示和验证文本框答案

【问题标题】：How to display and validate textbox based on radio button selected如何根据选择的单选按钮显示和验证文本框
【发布时间】：2019-03-01 16:44:01
【问题描述】：

我有这 2 个基于单选按钮选择的单选按钮，我应该显示文本框，还应该验证文本框。如果我选择单选按钮是并且文本框为空，那么我应该显示错误。使用下面的代码，我只能显示和隐藏文本框，但无法验证文本框。请提出解决方案。

型号：

public class CustomerModel  
{
  [Required(ErrorMessage = "Please select subscribe option")]
  public bool Subscribe {get; set;}

  public string Email {get; set;}
}

查看：

 function ShowHideDiv() {
            var chkYes = document.getElementById("Yes");
            var dvtext = document.getElementById("dvtext");
            dvtext.style.display = chkYes.checked ? "block" : "none";
        }

        $(function () {
            warningel = document.getElementById('lbError');
            $("#radio").submit(function () {
                if ($('#Yes').is(':checked') && !$.trim($('#Email').val())) {
                    warningel.innerHTML = "Please Enter Email";
                    return false;
                }
            });
        });

 <div class="form-group col-md-12 ">
                    <label class="required" for="subscribe">Email Subsciption</label>
                    <span >Yes : <input type="radio" value="Yes" name="Subscribe" id="chkYes" onclick="ShowHideDiv()" /></span>
                    <span >No : <input type="radio" value="No" name="Subscribe" id="chkNo" onclick="ShowHideDiv()" /></span>
          @Html.ValidationMessageFor(model => model.Subscribe)
                </div>
                <div id="dvtext" style="display: none">
                    <label for="email" class="required">Enter Email</label>
                    <div style="width:300px;">
                        @Html.TextBoxFor(model => model.Email)
                         <div id='lbError' style="color: red;"></div>
                        @Html.ValidationMessageFor(m => m.Email)
                    </div>
                </div>

【问题讨论】：

如果我在模型上添加必需属性，无论选择什么选项，文本框都将成为必需。如果我不选择单选按钮，我也不想显示文本框，如果单选按钮没有，则文本框不是强制性的
啊啊啊我现在看到了...编辑答案。

标签： javascript c# asp.net-mvc razor

【解决方案1】：

我认为更简洁的解决方案是仅使用 javascript 来显示/隐藏文本框并让 MVC 处理验证，您可以通过继承 IValidatableObject 来获得。

假设您在某处有一个 isValidEmail() 自定义方法来检查提供的字符串：

public class CustomerModel : IValidatableObject
{
    public bool Subscribe {get; set;}
    public string Email {get; set;}

    public IEnumerable<ValidationResult> Validate(ValidationContext validationContext)
    {
        if (Subscribe && !isValidEmail()) 
        {
            yield return new ValidationResult("Please enter valid email address");
        }
    }
}

【讨论】：