Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Required attribute not working on select field #1007

Open
otatechie opened this issue Feb 11, 2022 · 3 comments
Open

Required attribute not working on select field #1007

otatechie opened this issue Feb 11, 2022 · 3 comments
Labels

Comments

@otatechie
Copy link

Describe the bug
The required attribute is a boolean attribute.
When present, it specifies the user is required to select a value before submitting the form.

Expected behavior
If present on any of these input types and elements, the :required pseudo class will match.

Desktop (please complete the following information):

  • OS: [e.g. iOS]
  • Browser [e.g. Brave]
  • Version [e.g. 1.35.100]

Additional context
Required helps provide an indication to users informing them the form control is required. The aria-required attribute indicates that user input is required on the element before a form may be submitted improving accessibility.

@otatechie otatechie added the bug label Feb 11, 2022
@mtriff
Copy link
Member

mtriff commented Feb 12, 2022

Please provide a simplified code example demonstrating the bug.

@otatechie
Copy link
Author

<select class="js-choice">
    <option value="">Please select </option>
    <option value="Red">Red </option>
    <option value="Yellow">Yellow </option>
</select>

<script>
    const choices = new Choices('.js-choice');
</script>

@amineo
Copy link

amineo commented Jun 22, 2022

@thehappytechie There appears to be CSS only fix mentioned in #449.

.choices[data-type*="select-one"] select.choices__input {
  display: block !important;
  opacity: 0;
  pointer-events: none;
  position: absolute;
  left: 0;
  bottom: 0;
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants