问题
Not duplicate
This question should be reopened as previous questions (on this topic) with answers are 4-5 years old and refer to respective project's old versions. Not to mention that year in computing is like a 'light year' in real life.
Please vote to reopen this question!
Status
In the project i am using:
- Bootstrap v4.4.1
- jQuery validation plugin v1.19.1
- Select2 v4.0.13
- Select2 Bootstrap4 theme v1.3.2
The problem
Bootstrap4 works well with jQuery validation plugin.
When i add Select2 "into the mix" jQuery validation disappears as Select2 creates new element which contains Select2 control and hides Bootstrap's custom-select.
I suspect that validations works - it just is not seen because select2 hides initial select element.
At the moment:
- Outline is stuck at color: blue (should have been red or green)
- In case of item validates - check mark not shown
- In case of an error - warning exclamation mark in circle not shown
Examples
I created a JSFiddle that shows the problem.
jQuery Validation + bootstrap4 = working as intended example 1
jQuery Validation + bootstrap4 + select2 = part of validation is not seen on select2 control example 2
Conclusion
I have meticulously looked through existing similar questions on StackOverflow and tried out most of suggestions, yet they reference old versions of libraries and are not applicable in current case as in the new versions of libraries there are used different code structure... so old solutions do not work anymore... I tried to account for that when applying solutions, but to no avail.
Update 1
Updated conclusion block.
Update 2
At this point i am stuck.
Thank you for ideas and proposals!
来源：https://stackoverflow.com/questions/61839448/styling-select2-in-line-with-bootstrap4-and-displaying-error-success-with-j