question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Not possible to use "required" validation with radio buttons in Chrome

See original GitHub issue

For such ratio button(s):

          <div class="row">
              <div class="input-field col s12 center-align">
                <input type="radio" name="category" value="category1" id="point-category-category1" required />
                <label for="point-category-category1">Category 1</label>
              </div>
          </div>

I am getting in the Chrome the following error:

An invalid form control with name='category' is not focusable.

The reason is probably because Materialize hides the radio buttons away from the page and replace it with custom rendering.

Issue Analytics

  • State:closed
  • Created 8 years ago
  • Comments:17 (1 by maintainers)

github_iconTop GitHub Comments

4reactions
EdgarMPcommented, Sep 29, 2016

I still have this problem. Any suggestions?

2reactions
ianarsenaultcommented, Aug 25, 2016

+1 on this. In v.97.7 Chrome doesn’t work. Firefox displays the required message, but its no where near the radio buttons.

Read more comments on GitHub >

github_iconTop Results From Across the Web

javascript radio button validation, works in chrome, not in IE
I have this code to check that one from each group of radio buttons has been selected before the user can submit the...
Read more >
Support for Marking Radio Buttons Required, Invalid
Part of the challenge is that the required attribute is not valid on a <fieldset> (which maps to the group role). This is...
Read more >
<input type="radio"> - HTML: HyperText Markup Language
Radio buttons don't participate in constraint validation; they have no real value to be constrained. Styling radio inputs. The following example ...
Read more >
Accessible validation of checkbox and radiobutton groups
If the form and system as a whole is properly designed it should not be possible to enter incorrect information using these controls....
Read more >
Radio button validation not working on FireFox - Google Groups
It seems that the ng-required doesn't change to false on FireFox when the male model is set. It looks like a Angular bug,...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found