I'm having an issue with a implementation of a Section Expandable, the issue is that given the following scenario:

- Section Expandable in List Records

- Having at least two sections

- Both sections collapsed


And using a server action and ajax refresh to change the variable that controls the isExpanded property, which is same..., will expand both sections, that's fine, but the top section is not pushing properly and the top section gets over the bottom section, it overlaps, any idea on how to make it push the bottom section?. Any help will be appreciated.




Hi Francisco,


what themes are you using ?  this is a Silk UI pattern.  I tried a little demo with Liverpool theme, and it works for me.

see attached oml.


Dorine

Dorine Boudry wrote:

Hi Francisco,


what themes are you using ?  this is a Silk UI pattern.  I tried a little demo with Liverpool theme, and it works for me.

see attached oml.


Dorine


Hi Dorine, thanks for your reply, I'll try to explain better with a modification to the oml that you attached. The requirement is that the section has to be initially contract, an then when user expand the section, the sections inside should not be expanded, (but they get expanded even though that the variable isExpanded is set to false), and the user would perform an action (represented by the button), that action will put focus on an input box.


To view the bug:


1st Step: Run the project.

2nd Step: Click to expand.

  3rd Step: Contract sub-sections.

4th Step: Click button

5th Step: Contract6th: Click button, see bug.

The oml is attached. Thanks for your help.

Ah ok,

didn't get from the first post that you are using nested Section Expandables.  I had a quick look, and I think nesting them is buggy, even if you are not trying to control them with actions.  When you start with everything collapsed and expand the parent, both children will also appear collapsed, but then clicking the 'v' to collapse one of the children, will 'expand' it again, only collapsing after second time you choose the 'v' on it.

And inspecting the HTML, you can see, that although the child Sections appear expanded after expanding the parent, they don't have 'expanded' class.  Only after clicking an individual child section, it gets 'expanded' class.  You can also see that the little 'v' for collapsed doesn't come on the child turn upside when clicked.  They only change along with the parent 'v' when that one is clicked.

So I guess nesting them is not a good idea.

Dorine