“Uncaught TypeError: Cannot read property ‘setDefaults’ of undefined” in console when page is loaded

After updating the Jquery.Validation to version: 1.19.2, the error started displaying in the console on page load, it was not throwing errors with the older versions.

This is my code:

var defaultOptions = {
  validClass: '',
  errorClass: 'is-invalid',
  highlight: function(element, errorClass, validClass) {
    $(element).closest("div")
      .removeClass(this.validClass)
      .addClass(this.errorClass);
  },
  unhighlight: function(element, errorClass, validClass) {
    $(element).closest("div")
      .removeClass(this.errorClass)
      .addClass(this.validClass);
  }
};

$.validator.setDefaults(defaultOptions);

$.validator.unobtrusive.options = {
  errorClass: defaultOptions.errorClass,
  validClass: defaultOptions.validClass
};

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

The error is thrown specifically at :
“$.validator.setDefaults(defaultOptions);” line

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

Did not find a suitable solution to the issue in version 1.19.2, but downgrading the version back to it’s previous version 1.15.1 did the trick.

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0