Topic: Resizing stepper when a hidden div inside is set to show
I have a hidden div in side a step. Using 2 toggle switches (radio) - if you click on yes, the div inside display is set to show, so it expands. If you click on no, the div display gets set to none, so it disappears. The step should expand and contract based on the radio button you click.
If I click Yes, the step expands but not all the way, so that content inside is cut off. If I click Yes again, then the step expands. The same with No, it will only contract if I click it twice. How can this be fixed?
Thanks.
You can add listener to radio buttons click and run resizeStepper method on click.
The resizeStepper method when run recalculate the height of step content and adjust it if needed.
jumpshotink pro premium priority commented 2 weeks ago
Thanks - can you give a quick sample of the code? In this case, when you click on the radio button with class parentOption, the div with class parent-form's display is set to block.
Mateusz Lazaru staff commented 2 weeks ago
sure. here is the simplest example, you'l need to adjust it to your code. If you need more help, please send your snippet so we could help you fix it. https://mdbootstrap.com/snippets/standard/mlazaru/6362571#js-tab-view
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: Yes
- Technology: MDB Standard
- MDB Version: MDB5 8.2.0
- Device: Desktop
- Browser: Firefox
- OS: Mac OS 14.5
- Provided sample code: No
- Provided link: No