Fix implementation of jQuery.validate
Created by: mattwire
Overview
Fix implementation of jQuery validate in CiviCRM so that it actually uses the CRM settings, validates select2 fields and uses Civi/bootstrap classes for errors.
Partial from https://github.com/civicrm/civicrm-core/pull/16488
Before
jQuery validate in CiviCRM did not work with select2. In Common.js there was code to load CiviCRM specific settings but they weren't actually being loaded!
After
select2 is validated (note that the error message is currently the label - that could be improved as could the positioning of some of the error messages - that's all possible but out of scope for this PR!):
Technical Details
If the PR involves technical details/changes/considerations which would not be manifest to a casual developer skimming the above sections, please describe the details here.
Comments
Testing
For testing you can do in the browser console on a contribution page:
var validator = CRM.$('#Main').validate();
validator.settings - to show the settings that are loaded for the page.
CRM.$('#Main').valid(); to check if the form is "valid" - returns true/false.
Currently this will return valid for many required fields on the form if they are empty. This is because CiviCRM is not setting them as required before creating the form - that will be fixed in https://github.com/civicrm/civicrm-core/pull/16488.
So to test you have to add the class "required" to the form fields once the page has loaded:
This is particularly a problem for any processor that has "billing address" fields.