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.

HTML5 validation look and feel does not match with Bootstrap

See original GitHub issue

When I pass on the HTML5 attribute required to a FormControl like that (in React):

<FormControl
  required={required}
  {... input}
>
  {this.props.children}
</FormControl>

and submit that then this HTML5 validation error text pops in:

screen shot 2017-06-09 at 11 40 06

which does not match with the usual Bootstrap look and feel.

Using react-bootstrap v0.31.0 here which uses bootstrap v3.3.x and using latest Chrome v59 on Mac OS Sierra here.

I expect that kind of error text to be shown in the ControlLabel instead. Or at least make use of HTML’s native setCustomValidity() and wire it with Controllabel? Not sure if that’s doable …

Issue Analytics

State:
Created 6 years ago
Comments:9 (1 by maintainers)

Top GitHub Comments

1reaction

binarykitchencommented, Jun 11, 2017

thanks but i really dont have the time due to familiar circumstances. just can point to this API for now https://developer.mozilla.org/en-US/docs/Web/API/ValidityState

whenever input changes, parse validation state from that API and display its contents on your error label or whatever similar.

0reactions

TheBuzzer67commented, Jun 11, 2017

Is there something I can do to help?