在 ASP.NET Core MVC 中不工作的 bool 字段的不顯眼的客戶端驗證

Question

我在 ASP.NET Core 中發現了一個非常有趣的問題。 我正在使用我的 bool 字段作為復選框。 我想強制用戶選中要提交的表單的復選框。

我的 Model 類中的這個布爾字段是：

[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>