Brad Brad - 10 days ago 5
Javascript Question

How to make a collapsible data-role="list-divider"?

I'm trying to create a jQuery mobile formatted content listview like the demo on the jQuery Mobile site.

What I'd like to have is the

data-role="list-divider"
be collapsible. I've tried to have the
<li>
have both
data-role="list-divider"
and
data-role="collapsible"
(as well as
data-role="list-divider collapsible"
) but these don't work as expected. The example of a collapsible listview at the bottom of that demo page has both the list-divider and the content wrapped in a collapsible, which is not quite what I'm after.

Any ideas?

Answer

Rather than nesting collapsibles, I just emulated the behaviour like this:

$("[data-role='list-divider']").click(function() {
    $(this).nextUntil("[data-role='list-divider']").toggle();
});
Comments