Results 1 to 4 of 4

Thread: [4.2.1 GA] Scrolling issue with a buffered store (no way to see all rows)

Threaded View

Previous Post Previous Post   Next Post Next Post
    This duplicates another bug already reported in our system: EXTJS-10420
  1. #1
    Sencha User Daniil's Avatar
    Join Date
    Jun 2010
    Location
    Saint-Petersburg, Russia
    Posts
    1,018
    Vote Rating
    125
      0  

    Default [4.2.1 GA] Scrolling issue with a buffered store (no way to see all rows)

    REQUIRED INFORMATION

    Ext version tested:

    • Ext 4.2.1 GA
    Browser versions tested against:
    • Chrome
    • FireFox
    • IE9
    DOCTYPE tested against:
    • Scrolling issue with a buffered store (no way to see all rows)
    Description:
    • Something is wrong with scrolling in a grid with a buffered store. Please follow the test case.
    • It looks to be related to this issue, but not totally. So, I decided to report individually.
    Steps to reproduce the problem:
    • Scroll to the bottom
    The result that was expected:
    • It allows to scroll at the most bottom, i.e. see the row with 1199999.
    The result that occurs instead:
    • At some point it happens that there is no way to scroll more (I think it is possible you will get a bit different results):
      • Chrome doesn't show the last row (1199999).
      • FireFox stops on the 852175 row.
      • IE9 stops on the 73116 row.
    • If play with scrolling a little bit, there is a possibility to get an empty grid and/or a JavaScript error.
    Test Case:

    Code:
    <!DOCTYPE html>
    <html>
    <head>
        <title>Scrolling issue with a buffered store (no way to see all rows)</title>
    
        <link type="text/css" rel="stylesheet" href="../resources/css/ext-all.css" />
    
        <script type="text/javascript" src="../ext-all-debug.js"></script>
    
        <script type="text/javascript">
            Ext.Loader.setPath('Ext.ux', '../examples/ux');
            Ext.require([
                'Ext.ux.ajax.JsonSimlet',
                'Ext.ux.ajax.SimManager'
            ]);
    
            Ext.define('Ext.ux.ajax.JsonSimletWithTotal', {
                extend: 'Ext.ux.ajax.DataSimlet',
                alias: 'simlet.jsonwithtotal',
    
                doGet: function (ctx) {
                    var me = this,
                        page = [],
                        i, 
                        j,
                        reader = ctx.xhr.options.proxy.reader,
                        ret = me.callParent(arguments), // pick up status/statusText
                        response = {};
    
                    for (i = ctx.params.start, j = 0; i < ctx.params.start + ctx.params.limit; i++, j++) {
                        page[j] = {
                            test: "test " + i
                        }
                    };
    
                    response[reader.root] = page;
                    response[reader.totalProperty] = 1200000;
    
                    ret.responseText = Ext.encode(response);
                    return ret;
                }
            });
    
    
            Ext.onReady(function () {
                Ext.ux.ajax.SimManager.register({
                    'remote-data.php': {
                        stype: 'jsonwithtotal'
                    }
                });
    
                window.grid = Ext.create("Ext.grid.Panel", {
                    renderTo: Ext.getBody(),
                    height: 500,
                    width: 200,
                    store: {
                        autoLoad: true,
                        buffered: true,
                        pageSize: 100,
                        fields: [{
                            name: "test"
                        }],
                        proxy: {
                            type: 'ajax',
                            url: 'remote-data.php',
                            reader: {
                                type: 'json',
                                root: 'data'
                            }
                        }
                    },
                    columns: {
                        items: [{
                            text: "Test",
                            dataIndex: "test"
                        }]
                    }
                });
            });
        </script>
    </head>
    <body>
    </body>
    </html>
    *EDIT BY SLEMMON
    Issue observed in IE9, FF, and Chrome on 4.x (Chrome issue resolved in the latest internal SDK)
    Last edited by slemmon; 27 Jun 2013 at 10:45 AM. Reason: additional test notes
    Object.NET
    Frameworks and Tools for .NET Developers
    --------------------------------------------------
    Ext.NET - Ext JS for ASP.NET - Examples | Twitter
    Bridge.NET - Write C#. Run JavaScript! - Live | Twitter
    --------------------------------------------------

Posting Permissions

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