Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

How can I display different error messages on my MUI input field?

I have a form input field that displays an error if the user tries to submit while empty, but I also want to show a different error message is the input is not unique, I currently have this

<FormTextField
    className={classes.nameInput}
    errorMessages={[handleErrorMessage()]}
    label="Recipe Name"
    id="recipe-name"
    isRequired
    name="name"
    onChange={handleChange}
    placeholder="Recipe name"
    validators={['required']}
    value={slug}
    autoFocus
/>

This is MUI v4

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

>Solution :

first solution:

you can use snackbar that found in material ui document:

https://v4.mui.com/components/snackbars/

and u can put one or more than one message

second solution:

maybe this post will help u, It is very close to your question:

https://stackoverflow.com/questions/49421792/how-to-use-material-uinext-textfield-error-props
Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading