React Form Validation: MDBSelect does not work

Topic: React Form Validation: MDBSelect does not work

be.careSA free asked 2 years ago

*Expected behavior*When I submit a form with MDBSelect, I expected the same validation that I get with MDBInput or with the select tag.

*Actual behavior*The validation does not work.

Resources (screenshots, code snippets etc.)


             <form onSubmit={handleSubmit} className={"needs-validation mt-3 mb-3"} noValidate>

                        <MDBSelect label="Example label" required>
                            <MDBSelectInput selected="Choose your country" />
                                <MDBSelectOption disabled>Choose your country</MDBSelectOption>
                                <MDBSelectOption value="1">USA</MDBSelectOption>
                                <MDBSelectOption value="2">Germany</MDBSelectOption>
                                <MDBSelectOption value="3">France</MDBSelectOption>
                                <MDBSelectOption value="4">Poland</MDBSelectOption>
                                <MDBSelectOption value="5">Japan</MDBSelectOption>

                    <div className={"d-flex justify-content-between mt-3"}>

                        <ButtonLink text={"Annuler"} customClassNames={["ml-0"]}
                                    handleClick={handleClick as () => void}/>

                        <MDBBtn className={"btn btn--primary mr-0"}
                                type="submit">{mode === CREATE_MODE ? "Créer nouveau protocol" : "Sauver changements"}</MDBBtn>



Submit Function:

   const handleSubmit = (e: React.ChangeEvent<HTMLFormElement>) => {
    e.preventDefault(); += " was-validated";
    if (mode === EDIT_MODE) {
        // dispatch<any>(saveProtocolDraft(inEditProtocolDraft as ProtocolDraft, fieldsValue, token, history))
    if (mode === CREATE_MODE) {
        // dispatch<any>(createProtocolDraftInDb(fieldsValue, token, history))

Piotr Glejzer staff answered 2 years ago


we don't have an example with material select validation in form. We can create this in the future. Sorry about that. Have a nice day.


Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB React
  • MDB Version: 4.20.0
  • Device: Laptop
  • Browser: Chrome
  • OS: Mac
  • Provided sample code: No
  • Provided link: No