Home > Back-end >  Material-UI Dropdown overflowed in Dialog
Material-UI Dropdown overflowed in Dialog

Time:10-04

I'm trying to use a dropdown select inside of a Dialog (modal). However, the options get cut off by the bottom of the modal. How can I get the options to continue further down past the bottom border?

I'm using MUI v5.

<Dialog open={open}>
  <DialogContent>
    <Autocomplete
      disablePortal
      id="combo-box-demo"
      options={options}
      // getOptionLabel={(option) => option}
      sx={{ width: 300 }}
      renderInput={(params) => <TextField {...params} label="Numbers" />}
    />
  </DialogContent>
</Dialog>

(extreme) example: Codesandbox Demo

  • Related