Jump to content
  • 0

Auto Height Collapsible Sections



Hi, I have a collapsible table which has 7 sections. All sections are closed at start up. On opening a section I click a checkbox which increases the number of elements but the elements at the bottom of the section disappear under the next section banner. I have to close the section and reopen it again to adjust the height of the section. Is there a way that the section can adjust its height automatically?

The code to control the section is:-

<button type="button" class="collapsible">1. Section Name</button>
<div class="content"><table><td>

and the code at the send of the section is


Thanks in anticipation , Ron

Link to comment
Share on other sites

1 answer to this question

Recommended Posts

  • 0

Solved. I'm not sure if this is the orthodox remedy but it definitely works. Hope this helps someone experiencing the same problem.

Here's the footer  code which controls the height the section opens to. 



By replacing the line

 content.style.maxHeight = content.scrollHeight + "px";


content.style.maxHeight = 10000 + "px";

This will expand or contract the section when change occurs takes place within the section


The collapsible feature was taken from the Caspio Youtube video https://www.youtube.com/watch?v=tNy1G-F3HiE

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...