QRunIO/qqq-frontend-material-dashboard
2
0
Fork 0
mirror of https://github.com/Kingsrook/qqq-frontend-material-dashboard.git synced 2025-07-17 12:50:43 +00:00
Code Issues Packages Projects Releases Wiki Activity

CE-1068 - scroll-top-top to show alerts in modals

Browse Source
This commit is contained in:
darin.kelkhoff
2024-05-01 15:35:13 -05:00
parent e0f689544d
commit 1bf1f09e9d
1 changed files with 19 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
src/qqq/components/forms/EntityForm.tsx
View File

@ -927,7 +927,7 @@ function EntityForm(props: Props): JSX.Element
else else
{ {
setAlertContent(error.message); setAlertContent(error.message);
HtmlUtils.autoScroll(0); scrollToTopToShowAlert();
} }
}); });
} }
@ -973,7 +973,7 @@ function EntityForm(props: Props): JSX.Element
else else
{ {
setAlertContent(error.message); setAlertContent(error.message);
HtmlUtils.autoScroll(0); scrollToTopToShowAlert();
} }
}); });
} }
@ -981,6 +981,22 @@ function EntityForm(props: Props): JSX.Element
}; };
/*******************************************************************************
**
*******************************************************************************/
function scrollToTopToShowAlert()
{
if (props.isModal)
{
document.getElementById("modalTopReference")?.scrollIntoView();
}
else
{
HtmlUtils.autoScroll(0);
}
}
/******************************************************************************* /*******************************************************************************
** **
*******************************************************************************/ *******************************************************************************/
@ -1265,6 +1281,7 @@ function EntityForm(props: Props): JSX.Element
return ( return (
<Box sx={{position: "absolute", overflowY: "auto", maxHeight: "100%", width: "100%"}}> <Box sx={{position: "absolute", overflowY: "auto", maxHeight: "100%", width: "100%"}}>
<Card sx={{my: 5, mx: "auto", p: 6, pb: 0, maxWidth: "1024px"}}> <Card sx={{my: 5, mx: "auto", p: 6, pb: 0, maxWidth: "1024px"}}>
<span id="modalTopReference"></span>
{body} {body}
</Card> </Card>
</Box> </Box>