Using a nested list
A Nested List is a list that is embedded within the list item of another list. A right arrow icon is shown by default on the list item and when you click on it, the framework opens a separate sub page to display the nested list. The sub page shown uses theme b
by default for the page header. The framework can handle nesting to n-levels. This recipe shows you how to use nested lists and also how to fetch the child pages of the nested list using JavaScript.
Getting ready
Copy the full code of this recipe from the code/06/nested-list
sources folder. This code can be launched using the URL http://localhost:8080/06/nested-list/main.html
.
How to do it...
In
main.html
, add the following code to create a list of authors. Add nested lists with book names to some of the authors.<div data-role='content'> <ul data-role='listview' data-theme='b' data-inset='true'> <li><a href='#'>H.G. Wells</a></li> <li><a href='#'>Rabindranath...