<Accordion>
<AccordionSummary
expandIcon={<ExpandMoreIcon />}
aria-controls="panel1a-content"
id="panel1a-header"
>
<h6 className="title">Categories</h6>
</AccordionSummary>
<AccordionDetails>
<input onChange={handleCheck} type="checkbox" value="1" />
<input onChange={handleCheck} type="checkbox" value="1" />
</AccordionDetails>
</Accordion>
I have placed input type checkbox inside material ui accordian details panels and whenever i click checkbox the accordion collapses automatically.
handleCheck function:
const handleCheck = (event) => {
event.stopPropagation();
const { id, checked } = event.target;
setSelectedCategories([...selectedCategories, id]);
if (!checked) {
setSelectedCategories(selectedCategories.filter((item) => item !== id));
}
};
handleChange fnuction:
const handleChange = (panel) => (event, isExpanded) => {
setExpanded(isExpanded ? panel : false);
};
Aucun commentaire:
Enregistrer un commentaire