Question

New view on list select or disclosure

I think there are many ways to handle the function select or disclose on a list. I did see the vimeo tutorial in the sencha’s doc. However I do not want ot use controller.js if it’s possible here, because I only have 2 or 3 items.

How can I push a view when I click on item or disclose ? I tried everything ext.create, Ext.ComponentManager.get(‘listdetails’).push(… where I have a listdetails.js with an xtype: ‘listdetails’.

Help and thanks ^^

Main.js

Ext.define('easylist.view.Main', {
          extend: 'Ext.tab.Panel',
          requires: [
              'Ext.navigation.View',
              'Ext.dataview.List',
              'Ext.data.Store'
          ],

        config: {
            items: [
                {
                    xtype: 'container',
                    title: 'Tab 1',
                    iconCls: 'info'
                },
                {
                    xtype: 'container',
                    title: 'Tab 2',
                    iconCls: 'info'

                },
                {
                    xtype: 'container',
                    title: 'Tab 3',
                    iconCls: 'info'
                },
                {
                    xtype: 'navigationview',
                    title: 'MyNavigationView',
                    iconCls: 'info',
                    items: [
                        {
                            xtype: 'list',
                            title: 'uyuyuy',

                            store: {
                                  fields: ['name'],
                                  data: [
                                    {name: 'Cowper'},
                                    {name: 'Everett'},
                                    {name: 'University'}                                
                                  ]
                                },
                                onItemDisclosure: true,


                                itemTpl: '{name}',
                                listeners: {
                                    select: function(view, record) {
                                        navview = view.up('navigationview'),
                                         navview.push({How can I view lisdetail1.js     or 2, or 3 depending onselect?????})      
                                    },
                                   // disclose: function(view, record) {
                                   //     Ext.Msg.alert('Selected!', 'You selected ' + //record.get('name'));                                    
                           //         }
                                }

                            }
                    ]
                }
            ],
            tabBar: {
                docked: 'bottom'
            }
        }

    });

Answer 1

Try this

listeners: [
        {
            fn: 'onMylistItemSingletap',
            event: 'itemsingletap',
            delegate: '#mylist'
        }
    ],
onMylistItemSingletap: function(dataview, index, target, record, e, options) {
    var nav=dataview.up('navigationview');
    if(index==0){
        nav.push({
            xtype: 'listdetail1'
        });
    }
    else if(index==1){
        nav.push({
            xtype: 'listdetail2'
        });
    }    
    else if(index==2){
        nav.push({
            xtype: 'listdetail3'
        });
    }    
}

hope it helps you ^^