Results 1 to 6 of 6

Thread: can't click on list item after viewing list

  1. #1
    Sencha User
    Join Date
    Jun 2012
    Posts
    52
    Answers
    4
    Vote Rating
    2
      0  

    Default Answered: can't click on list item after viewing list

    Okay, so I'm having a bit of a problem here. I've got a bunch of views defined using Ext.define. I've got a top level navigation view, inside of which is a tab panel. The main panel is a container which plays host to a list of products which you click through to get to a page. The first item in the list goes to another page where there is another container which also contains a list in it. Now, when I first click through to this page (let's say subpage), I can click through all the links in this list, which go to their own respective subsubpages, and this is just fine. But, once I leave this subpage of products, head back there, I can no longer click on these sub page links.

    The simplest case I can find is:
    -click on home page link to 'subpage'
    -click back on navigation view
    -click back to 'subpage'
    -Can no longer click through these 'subpage' links in the list.

    The part I find weird is I can do it if I go there the first time, it's fine, but the next time, even if I didn't click on any of the links the first time, it doesn't work. Any ideas?

  2. Fixed it! I found someone who had a similar issue before:
    http://www.sencha.com/forum/showthread.php?181064-Ext.navigation.View-push-works-only-once

    I
    set the autoDestroy property of the subview to false, and it started working okay. In my app, I still get a warning about creating something with the same id multiple times, but that's another topic.

  3. #2
    Sencha User jerome76's Avatar
    Join Date
    Apr 2012
    Location
    New Jersey
    Posts
    1,149
    Answers
    132
    Vote Rating
    100
      0  

    Default

    Are any errors showing up on the debugger? I know in the past i'd get wierd DOM errors when using lists and destroying/recreating views.

  4. #3
    Sencha User
    Join Date
    Jun 2012
    Posts
    52
    Answers
    4
    Vote Rating
    2
      0  

    Default

    Nope, looked through the console in Chrome Developer Tools and saw no errors come up.

  5. #4
    Sencha User jerome76's Avatar
    Join Date
    Apr 2012
    Location
    New Jersey
    Posts
    1,149
    Answers
    132
    Vote Rating
    100
      0  

    Default

    Any demo you can create or using sencha fiddle so I can try it out?

  6. #5
    Sencha User
    Join Date
    Jun 2012
    Posts
    52
    Answers
    4
    Vote Rating
    2
      0  

    Default

    app.js
    Code:
    Ext.application({
        name: 'TestCase',
    
    
        requires: [
            'Ext.MessageBox', 'Ext.tab.Panel', 'Ext.dataview.List', 'Ext.data.Store'
        ],
    
    
        views: ['Main', 'Top', 'Sub', 'SubSub' ],
        controllers: [ 'MainController' ],
    
    
        icon: {
            '57': 'resources/icons/Icon.png',
            '72': 'resources/icons/Icon~ipad.png',
            '114': 'resources/icons/Icon@2x.png',
            '144': 'resources/icons/Icon~ipad@2x.png'
        },
    
    
        isIconPrecomposed: true,
    
    
        startupImage: {
            '320x460': 'resources/startup/320x460.jpg',
            '640x920': 'resources/startup/640x920.png',
            '768x1004': 'resources/startup/768x1004.png',
            '748x1024': 'resources/startup/748x1024.png',
            '1536x2008': 'resources/startup/1536x2008.png',
            '1496x2048': 'resources/startup/1496x2048.png'
        },
    
    
        launch: function() {
    
    
            // Initialize the main view
            Ext.Viewport.add(Ext.create('TestCase.view.Main'));
        },
    
    
        onUpdated: function() {
            Ext.Msg.confirm(
                "Application Update",
                "This application has just successfully been updated to the latest version. Reload now?",
                function(buttonId) {
                    if (buttonId === 'yes') {
                        window.location.reload();
                    }
                }
            );
        }
    });
    Main.js
    Code:
    Ext.define("TestCase.view.Main", {
        extend: 'Ext.navigation.View',
        requires: [ 'Ext.tab.Panel' ],
    
    
        config:
        {
            items:
            [
            {
                xtype: 'tabpanel',
                title: 'TestCase',
                tabBarPosition: 'bottom',
    
    
                items:
                [
                    {
                        title: 'Welcome',
                        iconCls: 'home',
                        xtype: 'topview'
                    }
                ]
            }
            ]
        }
    });
    MainController.js
    Code:
    Ext.define( 'TestCase.controller.MainController',
    {
        extend: 'Ext.app.Controller',
        
        config:
        {
            refs:
            {
                topList: '#topList',
                subList: '#subList'
            },
            control:
            {
                topList:
                {
                    itemtap: 'onTap'
                },
                subList:
                {
                    itemtap: 'onSubTap'
                }
            }
        },
        
        onTap: function( list, index, node, record )
        {
            list.up( 'navigationview' ).push( 
            {
                xtype: record.get( 'subXtype' ),
                record: record,
                title: record.get( 'name' )
            } );
        },
        
        onSubTap: function( list, index, node, record )
        {
            list.up( 'navigationview' ).push(
            {
                xtype: record.get( 'subsubXtype' ),
                record: record,
                title: record.get( 'name' )
            } );
        }
    });
    Top.js
    Code:
    Ext.define( 'TestCase.view.Top',
    {
        extend: 'Ext.Container',
        xtype: 'topview',
        
        config:
        {
            layout: 'vbox',
            
            items:
            [
            {
                xtype: 'list',
                itemTpl: '{name}',
                id: 'topList',
                flex: 1,
                data:
                [
                    {
                        name: 'hey',
                        subXtype: 'subview'
                    }
                ]
            }
            ]
        }
    } );
    Sub.js
    Code:
    Ext.define( 'TestCase.view.Sub',
    {
        extend: 'Ext.Container',
        xtype: 'subview',
        
        config:
        {
            layout: 'vbox',
            
            items:
            [
            {
                xtype: 'list',
                itemTpl: '{name}',
                id: 'subList',
                flex: 1,
                data:
                [
                    {
                        name: "hey",
                        subsubXtype: 'subsubview'
                    }
                ]
            }
            ]
        }
    } );
    SubSub.js
    Code:
    Ext.define( 'TestCase.view.SubSub',
    {
        extend: 'Ext.Container',
        xtype: 'subsubview',
        
        config:
        {
            html: 'Hey'
        }
    } );
    index.html
    Code:
    <!DOCTYPE HTML>
    <html manifest="" lang="en-US">
    <head>
        <meta charset="UTF-8">
        <title>TestCase</title>
        <!-- The line below must be kept intact for Sencha Command to build your application -->
        <script id="microloader" type="text/javascript" src="sdk/microloader/development.js"></script>
    </head>
    <body>
    
    
    </body>
    </html>
    This accurately reproduces my problem.

  7. #6
    Sencha User
    Join Date
    Jun 2012
    Posts
    52
    Answers
    4
    Vote Rating
    2
      0  

    Default

    Fixed it! I found someone who had a similar issue before:
    http://www.sencha.com/forum/showthread.php?181064-Ext.navigation.View-push-works-only-once

    I
    set the autoDestroy property of the subview to false, and it started working okay. In my app, I still get a warning about creating something with the same id multiple times, but that's another topic.

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •