Search code examples
reactjsantdant-design-pro

How to disable the option from the Select dropdown in ant Design react js


Here, I am keeping some code snippets for understanding, do reply if you have any understanding issues.

I need to disable some options based on isSubmitted is 1

 <Select
              // disabled={disbledOption}
              showSearch
              mode="multiple"
              allowClear
              optionFilterProp="children"
              placeholder="Vendors"
              options={vendorsMaster}
              style={{ maxHeight: '70px', overflowY: 'auto' }}
              filterOption={(input: string, option: any) =>
                filterOption(input, option)
              }
            >
         
              {props.vendorTagVal &&
                props.vendorTagVal.map((opt: any) => (
                  <Option
                    disabled={opt.IsSubmitted !== 1}
                    key={opt.VendorID}
                    value={opt.VendorID}
                  >
                    {opt.VendorName}
                  </Option>
                ))}
            </Select>

Solution

  • you need to use useState for diabled : const [disabled, setDisabled] = useState(true);