Problem description
Using certain falsy values (null, undefined, '') with SelectField MenuItem does not push the floating label text above the underlying TextField.
Steps to reproduce
- Create a
SelectField with floatingLabelText, value of null
- Non-empty
floatingLabelText
value of null
- Give the
SelectField a child MenuItem
- Non-empty
primaryText
value of null
floatingLabelText overlaps the MenuItem's primaryText on top of the TextField
Notes
What I'm really trying to do is add the ability to "unselect" a SelectField. If there are better ways of accomplishing this, I'm open to it. I already have a workaround, but it's using "magic" strings to represent a null, which requires me to map from null to that string when working with this component. Feels awkward / error-prone.
Versions
- Material-UI: 0.15.0
- React: 15.0.2
- Browser: Chromium 51.0.2704.36 (nw.js nightly, windows x64)
Images & references
Problem description
Using certain falsy values (
null,undefined,'') withSelectFieldMenuItemdoes not push the floating label text above the underlyingTextField.Steps to reproduce
SelectFieldwithfloatingLabelText, value ofnullfloatingLabelTextvalueofnullSelectFielda childMenuItemprimaryTextvalueofnullfloatingLabelTextoverlaps theMenuItem'sprimaryTexton top of theTextFieldNotes
What I'm really trying to do is add the ability to "unselect" a
SelectField. If there are better ways of accomplishing this, I'm open to it. I already have a workaround, but it's using "magic" strings to represent anull, which requires me to map fromnullto that string when working with this component. Feels awkward / error-prone.Versions
Images & references