Material-ui: [TextField] Don't add asterisk to required field label and placeholder

Created on 13 Feb 2018  路  3Comments  路  Source: mui-org/material-ui

Is there a good reason to insert an asterisk (*) when adding the required prop to TextField? There are valid cases to not have an asterisk in a required form (login forms) and this is a visual choice that should be left for the developer to decide. I don't believe people should resort from using the TextField component just because of an asterisk that could be manually added.

question

Most helpful comment

@pietrofxq The asterisk is added as asked by the specification. You are free to disable it:
https://github.com/mui-org/material-ui/blob/6c92ef12a4d205deea3cddc70f33988efef3da30/src/Form/FormLabel.js#L119

<TextField InputLabelProps={{ required: false }} />

All 3 comments

@pietrofxq The asterisk is added as asked by the specification. You are free to disable it:
https://github.com/mui-org/material-ui/blob/6c92ef12a4d205deea3cddc70f33988efef3da30/src/Form/FormLabel.js#L119

<TextField InputLabelProps={{ required: false }} />

This doesn't really solve the issue as good UI means not showing the asterisk if most or all fields are required fields (in which case it's better to display optional fields). For example, login forms. Both username and password are required fields, and it's obvious to users they are required. There are no other optional fields so it's better to not have the asterisk.

There are no other optional fields so it's better to not have the asterisk.

The solution @oliviertassinari proposed allows you to disable the asterisk on a required TextFiled (or to enable it on an optional one if you so choose).

You could even disable it by default: https://next.material-ui.com/customization/themes/#default-props

Was this page helpful?
0 / 5 - 0 ratings

Related issues

reflog picture reflog  路  3Comments

anthony-dandrea picture anthony-dandrea  路  3Comments

rbozan picture rbozan  路  3Comments

chris-hinds picture chris-hinds  路  3Comments

ghost picture ghost  路  3Comments