Notice: The Monaca & Onsen UI Community Forum is shutting down.

For Onsen UI bug reports, feature requests and questions, please use the Onsen UI GitHub issues page. For help with Monaca, please contact Monaca Support Team.

Thank you to all our community for your contributions to the forum. We look forward to hearing from you in the new communication channels.

Lists inside other lists?



  • Is it possible to add a list to another list? What I’m looking for is something like jQueryMobile’s idea of collapsible lists. You have an overarching category and then when you click on that, it expands to show the details inside.

    I started by adding a List to a ListItem and while it didn’t error, it displayed the “inside” list next to the category title. Maybe it’s up to me to get crazy with the CSS but I’m just checking here before I venture into that mess!



  • In case others are curious, it actually wasn’t that big a deal.

    The pseudo-code (notice, no tappable on the parent ListItem):

    <List
      <ListItem>
        Category name
        <List className="childList"
          <ListItem tappable>Item name</ListItem>
        />
    >
    

    The CSS:

    .list.childList {
    	width: 100%;
    	border: 0;
    }
    

    It looks like this on Android:
    0_1470422427007_upload-6933bd34-2ea3-4d2c-bc29-5d6dc4dac548

    It looks like this on iOS:
    0_1470422598421_upload-e131afcf-50d5-4417-8421-d560a911e8ea