In v0.x the Autocapitalize property would prevent mobile device keyboards from capitalizing the first letter - after upgrading to 1.x this does not seem to be the case
The Autocapitalize property seems to do nothing to prevent (on mobile devices especially) the first letter entered into the Textfield from being automatically capitalized (the device keyboard will SHIFT automatically when the Textfield is selected)
I have tried every variant I can think of from autoCapitalize="none" (which is what I used in v0.x) to autoCapitalize="off" (which I've seen in various docs on the web) as well as writing the prop out all lowercase (which I believe is the raw html way to do it) and every variation in between.
We use the textfield component for our login form - we have case-sensitive usernames which are often not capitalized. I would prefer not to have to revert to v0.x for this one case as this was a working feature and seems like it would be needed for v1.x as well.
Have you tried inputProps
?
https://material-ui-next.com/demos/text-fields/#components
"You might also have noticed that some native HTML input properties are missing from the TextField component. This is on purpose. The component takes care of the most used properties, then it's up to the user to use the underlying component shown in the following demo. Still, you can use inputProps (and InputProps, InputLabelProps properties) if you want to avoid some boilerplate."
Sorry must have missed that little blurb - there is no direct example of inputProps being used, but I attempted
@tonymckendry The solution to your problem is:
<TextField
inputProps={{
autoCapitalize: 'none',
}}
/>
@oliviertassinari - thank you. It turns out that the 3rd party keyboard I am using on my Android device (Swiftkey) is ignoring this rule, but the native Samsung Keyboard and the iOS keyboard are behaving as expected.
Hello All, I would like whatever the user enter in the TextField be transformed to uppercase ? Is there a way to do that with Material-UI components in React JS?
Most helpful comment
@tonymckendry The solution to your problem is:
https://codesandbox.io/s/koykw4w8vo