1. #1
    Sencha User
    Join Date
    Mar 2010
    Posts
    3
    Vote Rating
    0
    deusemc is on a distinguished road

      0  

    Default [4.2.0.489] bufferedrenderer grids on same store, store reload breaks row selection

    [4.2.0.489] bufferedrenderer grids on same store, store reload breaks row selection


    REQUIRED INFORMATION

    Ext version tested:
    • Ext 4.2.0 rev 489
    Browser versions tested against:
    • Chrome 24
    • IE9
    • FF18
    DOCTYPE tested against:
    • Quirks/None
    Description:
    • If a tabpanel houses two bufferedrenderer grids with a common store, when the store is reloaded from one grid, the other grid will no longer allow row selections
    Steps to reproduce the problem:
    • select rows from grid 1
    • tab switch to grid 2 and select rows from grid 2
    • reload the store for grid 2
    • switch the tab back to grid 1
    • select items from grid 1
    The result that was expected:
    • returning to grid 1 after reloading the store in grid 2 allows regular selection of rows
    The result that occurs instead:
    • rows from grid 1 no longer selectable (hover and click events continue to trigger). The last set of selected rows remain highlighted
    Test Case:
    This code uses a stripped down and single file consolidated version of the Ext MVC XML example grid (originally from loiane, thanks!)
    1. load contents
    2. click row 1 of the grid in tabpanel "one"
    3. switch to tabpanel "two" and click row 2 in the grid
    4. click the top left corner cell (the one above the number and to the left of title)
    5. this triggers a store reload
    6. click row 3 on the current grid and verify selection works
    7. switch back to tabpanel "one"
    8. click on row 4
    9. verify that you can not select row 4
    Code:
    <html>
    <head>
     <title>Ext JS 4 MVC</title>
     <!-- Ext JS Files -->
    <link rel="stylesheet" type="text/css" href="../../ext-4.2-rc/resources/css/ext-all.css">
    <script type="text/javascript" src="../../ext-4.2-rc/ext-all-dev.js"></script>
     
    <script>
    Ext.define('Book',{
        extend: 'Ext.data.Model',
        fields: [
            'Title'
        ]
    });
    Ext.define('Books', {
        extend: 'Ext.data.Store',
        model: 'Book',
        autoLoad: true,
        proxy: {
            type: 'ajax',
            url: 'data/sheldon.xml',
            reader: {
                type: 'xml',
                record: 'Item',
                idProperty: 'ASIN',
                totalRecords: '@total'
            }
        }
    });
    Ext.define('BookGrid' ,{
        extend: 'Ext.grid.Panel',
        alias : 'widget.bookgrid',
        title : 'XML Grid',
        plugins: [{
            ptype: 'bufferedrenderer'
        }],
            store: 'Books',
            columns: [{
                    "xtype": "rownumberer"
            },{
                    text: "Title",
                    dataIndex: 'Title'
            }],
        initComponent: function() {
            this.selModel = new Ext.selection.RowModel({mode: 'MULTI', pruneRemoved: false});
            this.callParent(arguments);
        }
    });
    Ext.define('ExtMVC.BooksC', {
        extend: 'Ext.app.Controller',
        stores: ['Books'],
        models: ['Book'],
        views: ['BookGrid'],
        init: function() {
            this.control({
                    'bookgrid rownumberer': {
                            headerclick: function(ct,column,e,t) {
                                    ct.ownerCt.getStore().load();
                            }
                    }
            })
        }
    });
    Ext.define('ExtMVC.view.Viewport', {
        extend: 'Ext.Viewport',
        layout: 'fit',
        requires: [
            'BookGrid'
        ],
        initComponent: function() {
            var me = this;
            Ext.apply(me, {
                items: [
                    {
                            xtype: 'tabpanel',
                            items: [{
                                    title: 'one',
                                    xtype: 'bookgrid'
                            },{
                                    title: 'two',
                                    xtype: 'bookgrid'
                            }]
                    }
                ]
            });
            me.callParent(arguments);
        }
    });
    Ext.application({
        name: 'ExtMVC',
        controllers: [
            'ExtMVC.BooksC'
        ],
        autoCreateViewport: true
    });
    </script>   
    </head>
    <body>
    </body>
    </html>
    HELPFUL INFORMATION

    Screenshot or Video:

    Debugging already done:
    • Issue only happens when the bufferedrenderer plugin is used and only when the grids read from the same store. If the store is unique or the buffered plugin removed, the grid functions properly.
    Possible fix:
    • Do not use buffered renderer with the same store
    • Use different stores with buffered renderer
    Additional CSS used:
    • only default ext-all.css
    Operating System:
    • Windows 7

  2. #2
    Sencha - Ext JS Dev Team Animal's Avatar
    Join Date
    Mar 2007
    Location
    Notts/Redwood City
    Posts
    30,499
    Vote Rating
    46
    Animal has a spectacular aura about Animal has a spectacular aura about

      0  

    Default


    You cannot share buffered stores.

    When one grid requires more pages, some pages required by the other gris might well be evicted from the page cache.

    If the dataset is not outrageously huge, try just a normal, fully loaded store, but use the bufferedrenderer plugin to keep the grid's DOM size down.

  3. #3
    Sencha User
    Join Date
    Mar 2010
    Posts
    3
    Vote Rating
    0
    deusemc is on a distinguished road

      0  

    Default


    Unfortunately the data set is large and will require the DOM optimizations of the buffered grid.

    Any recommendations for keeping two separate stores for the same data beyond cloning the store?

Thread Participants: 1

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi