-
-
Notifications
You must be signed in to change notification settings - Fork 32.5k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[TextField] No state class applied for readonly state #33613
Comments
Hi @hbjORbj any eta for this? |
Thanks for the report @noobDev31. We could indeed use a class for the read-only state of the Input, to match the behavior of other states. |
No issues @michaldudak. I just one need favor from you do you think this code - is the right way( passing label as null to the TextField) to achieve to these designs - or should I have broken the TextField the way the docs mentions - its made up of InputLabel, Input and FormHelperText and style all three of them separately. |
You're losing association between label and input this way. Note that a label must have the |
So now we have a CSS class for the readonly? |
After we release the next version (likely the next Monday). |
Well thanks a lot for this 😊 |
Related to #9790. |
Duplicates
Latest version
Current behavior 😯
I am trying to achieve the following permutation of styles with the Material UI TextField -
I am trying to remove the border of the input whenever I do readonly:true for the TextField.
But it doesn't take any effect and the reason can be that disabled and readonly are both getting the same CSS class.
Expected behavior 🤔
Readonly and Disabled should have a seperate CSS class so that they can targeted differently.
Sandbox - https://codesandbox.io/s/customizedinputs-demo-material-ui-forked-2unmw9?file=/index.tsx:809-870
Steps to reproduce 🕹
Steps:
1.Please open the following sandbox -
https://codesandbox.io/s/customizedinputs-demo-material-ui-forked-2unmw9?file=/index.tsx:809-870
and try giving the props -
InputProps={{ readOnly: true }}
to the LowCodeTextField component at index.tsx
2.The border doesn't get removed even though I have the class in the ThemeProviderconfig.ts
3.
4.
Context 🔦
No response
Your environment 🌎
npx @mui/envinfo
The text was updated successfully, but these errors were encountered: