search

luqin / react-icheck

:radio_button: iCheck components built with React. Highly customizable checkbox, radio buttons and radio group.
https://luqin.github.io/react-icheck
177 stars 40 forks source link

replace wrapping label with a div #6

Closed alex-e-leon closed 8 years ago

alex-e-leon commented 8 years ago

Wrapping the checkbox/radio in a label may force some users to create a second label tag if this approach doesn't suit their design. While having multiple labels point to the same input element isn't against spec, anecdotally this may cause accessibility issues (screen readers may only read the first label found). See https://stackoverflow.com/questions/2829936/can-an-input-field-have-two-labels#answer-3992160

Can we follow the lead of the original icheck library and wrap it in a div instead?

luqin commented 8 years ago

Hi, @alex-e-leon 

<Checkbox
  id="fname"
  name="fname"
  checkboxClass="icheckbox_square-blue"
  increaseArea="20%"
/>
<label for="fname">First name</label>
luqin commented 8 years ago

https://github.com/fronteed/icheck#how-it-works

alex-e-leon commented 8 years ago

@luqin Sorry, I misunderstood how the label functions were supposed to work, looks good to me now. (although I feel like the label stuff would work better as a seperate wrapping component).

luqin commented 8 years ago

@alex-e-leon OK. I will support this feature in react-icheck 1.0