[Dialog] Form + scroll in DialogContent

• This is not a v0.x issue.
• I have searched the issues of this repository and believe that this is not a duplicate.

I know this has been discussed in #12126, but there is still an issue with the scrolling, the title and the actions aren’t fixed and they scroll

Here is the codesandbox: https://codesandbox.io/s/qlo16r5v59

Here is the code

<Dialog open aria-labelledby="form-dialog-title">
  <form
    onSubmit={e => {
      alert("form submit!");
      e.preventDefault();
    }}
  >
    <DialogTitle id="form-dialog-title">Log in</DialogTitle>
    <DialogContent>
      <DialogContentText>
        Please enter your account number and password.
      </DialogContentText>
      <TextField
        autoFocus
        margin="dense"
        label="Account Number"
        type="text"
        fullWidth
      />
      <TextField
        margin="dense"
        label="Password"
        type="password"
        fullWidth
      />
      <div style={{ height: 1000 }} />
    </DialogContent>
    <DialogActions>
      <Button onClick={() => alert("cancel")} color="primary">
        Cancel
      </Button>
      <Button
        type="submit"
        onClick={() => alert("login")}
        color="primary"
        variant="contained"
      >
        Log in
      </Button>
    </DialogActions>
  </form>
</Dialog>

[oliviertassinari]

@hayatae Interesting, you need to apply this CSS

      <Dialog>
        <form
          onSubmit={e => {
            alert("form submit!");
            e.preventDefault();
          }}
          style={{
            overflowY: "auto",
            display: "flex",
            flexDirection: "column"
          }}
        >
          <DialogTitle

on the <form> element if you want to the dialog content to scroll instead of the dialog paper.

Alternatively, you can make the paper to host your form:

      <Dialog
        PaperProps={{
          component: "form",
          onSubmit: e => {
            alert("form submit!");
            e.preventDefault();
          }
        }}
      >
        <DialogTitle

[Ethorsen]

+1 We face the same issue. I will implement that ugly fix for now.

But it would be nice to fix MUI at the source and allow <Dialog*> elements to be wrapped in a form without affecting layout/scrolling functionality.