No workaroud validation when select is required

[jasomdotnet]

When <select> with Choices.js search is required and no option is selected, there is no message "Please fill the field" or any other action on form submit. Visitor has no clue where's the problem. Only console log contains msg:

The invalid form control with name=’required_select_name’ is not focusable.
An invalid form control is not focusable.

No class is added. For example Chosen jQuery plugin used to add following classes:

.chosen-container.error .chosen-choices,
.chosen-container.error .chosen-single {
    border: 2px solid red;
}

No configuration option is possible to made.

Similar bugs here:

#1070
#1061

Can you please fix this?

https://developer.mozilla.org/en-US/docs/Web/API/HTMLObjectElement/setCustomValidity

[DavidPetrasek]

Solution:

.choices [hidden] 
{
  display: none !important; <--- REMOVE THIS
  
  ADD THIS:
  position: absolute;
  visibility: hidden;
  opacity: 0;
  z-index: -9999;
}