Set Default value of MDBSelect while using addhandler

Hi @rashesh patel,

Thank for contact with me.

Can you update your MDB version to 4.17.0? If you update MDB check if the problem still exists.

Best, Konrad.

npm upgrade mdbreact

Hi @rashesh patel,

You can go to Multi Select page and to api tab to see how to usage this component.

getValue Returns Select value. Use this method to get an array with selected options.

for example <MDBSelect getValue={this.handleSelectChange} > and you dont need event in your props.

this same situation is about getTextContent.

getTextContent Returns input text content. Use this method to get a string with selected options.

Also, you use two times selected in your component.

MDBSelect no have props value

And if you want to add a new component with props option, all of these components use one state and when you change option in one component every component change options from state. You need to separate states options from components.

hello I have a big problem with mdbselect

when I click the same option, it will disappear. in better explanation the checked attribute turn to be false

<MDBSelect
            getTextContent={(value) =>{handlePoolChanged(value)}}
            name="pool"
            options={formData.pool.options}
            required
            color="teal"
            selected={
              !props.loadingPools ?
                (formData.pool.options.length ? "Select Pool" : "No Item")
                : "Loading..."
            }
            label="Pool"
          />




const handlePoolChanged = (value) => {
    if (props.poolData) {
      for (let pool of props.poolData) {
        if (pool.name === value) {
          setFormData((prevData) => {
            return {
              ...prevData,
              pool: {
                ...prevData.pool,
                poolInfo: pool,
                selectValue: value
              },
            }
          })
        }
      }
    }
  };

and the state is:

 const [formData, setFormData] = useState({
lunName: {
  value: "",
  options: [],
  validation: {
    checkingItems: {
      duplicateName: true,
      validChars: '(^(?![-_.0-9])[a-zA-Z0-9-_.]*$){1,10}',
      lengthChars: 50,
    },
    valid: false,
    text: '',
  },
},
pool: {
  options: [],
  selectValue: "",
  poolInfo: ""
},
size: {
  value: "",
  validation: {
    checkingItems: {
      validChars: '(^[0-9.]*$){1,10}',
    },
    valid: false,
    text: '',
  },
},
unit: {
  options: [
    { text: "MB", value: "MB", checked: false },
    { text: "GB", value: "GB", checked: true },
    { text: "TB", value: "TB", checked: false },
  ],
  selectValue: "GB",
},
count: {
  maxCount: 0,
  value: "",
  validation: {
    checkingItems: {
      validChars: '^[1-9]+[0-9]*$',
    },
    valid: false,
    text: '',
  },
},

});