Comments (8)
We pass-through all props to the component, so for
should be present too.
from react-radio-group.
Ah, I see. All props are passed to wrapper <div>
, not to every individual radio
element...
from react-radio-group.
Now I understand what you mean (I think so)
You should use something like:
<RadioGroup for="blah" Component="label">
<Radio>
// ...
from react-radio-group.
note it's htmlFor
not just for
i.e.
<RadioGroup htmlFor="blah" Component="label">
from react-radio-group.
My own hack was to use uuid, since ids need to be unique:
let num = 0 return <RadioGroup {...this.props} > { this.props.sources.map((item) => { let id = uuid.v4() num++ return <span><Radio id={id} key={num} value={item.name} /><label htmlFor={id}>{item.name}</label></span> } )} </RadioGroup>
perhaps it would be more nice if there was some built-in method for this?
from react-radio-group.
If you wrap Radio into label, you will need neither id nor htmlFor.
On Mon, 15 Aug 2016 at 22:47, themre [email protected] wrote:
My own hack was to use uuid, since ids need to be unique:
let num = 0
return <RadioGroup {...this.props} >
{
this.props.sources.map((item) => {
let id = uuid.v4()
num++
return {item.name}
}
)}
perhaps it would be more nice if there was some built-in method for this?—
You are receiving this because you commented.Reply to this email directly, view it on GitHub
#34 (comment),
or mute the thread
https://github.com/notifications/unsubscribe-auth/AAKsoJ2_eAlpqxv8rgLNfl6Bi9bAm6M8ks5qgF-0gaJpZM4Jj7zP
.
from react-radio-group.
ok, that would then solve the problem label not being clickable. thanks.
from react-radio-group.
What if you use it like this?
<RadioGroup name="published"> <label className="radio" name="published"> <Radio value="1" /> <span>Yes</span> </label> <label className="radio" name="published"> <Radio value="0" /> <span>No</span> </label> </RadioGroup>
from react-radio-group.
Related Issues (20)
- allow to pass className via props HOT 2
- Tab index issues HOT 1
- `displayName` in published NPM version is "index" which causes misleading error messages HOT 1
- Allow setting className?
- Iterate through array to get radio values HOT 1
- Breaking the whole render function HOT 10
- Automatic label assignment HOT 2
- Initial value not selecting radio button HOT 1
- Tests? HOT 2
- Id required somewhere HOT 4
- React warning about propTypes HOT 6
- not bug, just ask a question? HOT 1
- Indicate selection as required?
- Support for React 16 HOT 2
- Screen reader support is lacking. HOT 1
- Change documentation
- get more then value in the handleChange func HOT 3
- Move `prop-types` library to devDependencies HOT 4
- can this be used with useReducer? HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-radio-group.