3

I am using radio button group from material-ui. I can set defaultSelected to have a default selection but once rendered, i won't be able to set it programatically. It only changes when you click the radio. Is this something which we can do with material-ui?

1
  • can you share your code so that we can check Commented Aug 27, 2016 at 10:08

1 Answer 1

8

In react components can be either controlled or uncontrolled. Controlled means that you set that component value yourself and you keep the value in the parent component as well in a state or prop. While uncontrolled component means that you only set a default value and you let the component handle the rest.

Now in most cases you would need a component that edits a value to send that value out to its parent, for sending a server request or just storing this value in the application state, so I would argue that in most cases you should use a controlled component.

To do this in material-ui instead of setting the 'defaultSelected' propery use the 'valueSelected' property and set it to a prop or state variable, also use the 'onChange' callback to set the state value or propagate the callback outside where you will eventually change the state in a controller component or update the application state in some store.

Sign up to request clarification or add additional context in comments.

2 Comments

Thanks. I already had a state to track the selection, was using it for default selection. I was under the impression that valueSelected is to get the value of selection :) my bad
changing from defaultSelected to valueSelected resolved my issue. Thanks a ton!!!!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.