Question

我在ASP.NET Core中发现了一个非常有趣的问题。我正在将bool字段用作复选框。我想强制用户选中要提交的表单的复选框。

我的Model类中的bool字段是：

[Range(typeof(bool), "true", "true", ErrorMessage = "You must accept the Terms")]
public bool TermsAccepted { get; set; }

注意，我已应用[Range]验证属性。它完美可用于服务器端验证。

我的操作方法代码非常简单：

[HttpPost]
public IActionResult Index(JobApplication jobApplication)
{
    if (ModelState.IsValid)
        return View("Accepted", jobApplication);
    else
        return View();
}

但是当我应用客户端验证时出现了问题

在我看来，我应用了3个脚本：

@section scripts {
<script src="/lib/jquery/dist/jquery.min.js"></script>
<script src="/lib/jquery-validation/dist/jquery.validate.min.js"></script>
<script src="/lib/jquery-validation-unobtrusive/dist/jquery.validate.unobtrusive.min.js">
</script>
}

客户端验证的工作原理完全相反，当我选中该复选框时，它会给出错误消息。为什么会相反呢？

该复选框产生的HTML代码为：

<input type="checkbox" class="input-validation-error" data-val="true" data-val-range="You must accept the Terms" data-val-range-max="True" data-val-range-min="True" data-val-required="The TermsAccepted field is required." id="TermsAccepted" name="TermsAccepted" value="true" aria-describedby="TermsAccepted-error">

请帮助？

Answer 1

我遇到了这个问题，您的代码还可以添加一些内容...

我更新到了最新版本的jquery.validate（1.19.1）和jquery.validation.unobtrusive（3.2.11），（使用libman管理这些依赖项）。

我还添加了此javascript块，以扩展该页面上验证器方法的功能。

 <script>
      // extend range validator method to treat checkboxes differently
      var defaultRangeValidator = $.validator.methods.range;
      $.validator.methods.range = function(value, element, param) {
        if(element.type === 'checkbox') {
          // if it's a checkbox return true if it is checked
          return element.checked;
        } else {
          // otherwise run the default validation function
          return defaultRangeValidator.call(this, value, element, param);
        }
      }
    </script>

bool字段的不显眼的客户端验证在ASP.NET Core MVC中不起作用

1 个答案: