Material Ui - Add required attribute to a TextField in "select" mode

reactjs material-ui html-validation
Bichoy Messiha picture Bichoy Messiha · Sep 2, 2018 · Viewed 14.8k times · Source

I am trying to make "required" a TextField in select mode. I tried to add required prop like in this snippet, but this does not block the submit event if I haven't select anything. Although it adds the '*' to the label.

Please check this sandbox

UPDATE: (Clarification really) I am talking about html5 validation. In the sandbox example there are Select and Text fields, setting the text field as required will block the submit event and displays a native html5 error saying "this field is required", this is not the case if the field is "select".

Answer

Bichoy Messiha picture Bichoy Messiha · Sep 2, 2018

Material Ui provides another component Native Select to handle this kind of native validation.

Please check this example

Edit Material demo

Related questions

× TypeError: Cannot read properties of undefined (reading 'map')

When I try to run this code it gives me this error: × TypeError: Cannot read properties of undefined (reading 'map') I don't know why. I have tried possible means, but it didn't work. import React from 'react'; import Grid from …

Read More
Invalid hook call. Hooks can only be called inside of the body of a function component

I am new to React and Now I would like to show some record in the table and now I got this error. Help me, please. Invalid hook call. Hooks can only be called inside of the body of a …

Read More
What does the error "JSX element type '...' does not have any construct or call signatures" mean?

I wrote some code: function renderGreeting(Elem: React.Component<any, any>) { return <span>Hello, <Elem />!</span>; } I'm getting an error: JSX element type Elem does not have any construct or call signatures …

Read More