Sencha Touch Cookbook

Working with a list of nested data using NestedList

Imagine you have a nested data structure which you would like to present to the user in the form of a list and allow him/her to drill down the nested data structure. In this recipe, we will understand how to achieve this using the NestedList component.

Getting ready

Make sure that you have set up your development environment by following the recipes outlined in Chapter 1.

How to do it...

Carry out the following steps:

1. Create and open a new file named ch06_07.js and paste the following code in it:

   Ext.setup({ onReady: function() { var data = { items: [{ text: 'Flowers', items: [{ text: 'Roses', items: [{ text: 'Red', leaf: true },{ text: 'Peach', leaf: true },{ text: 'Yellow', leaf: true }] },{ text: ...