Hybrid View

  1. #1
    Sencha User
    Join Date
    Jul 2008
    Posts
    64
    Vote Rating
    1
    bradlymathews is on a distinguished road

      0  

    Default Scroll bars missing from Grid Panel

    Scroll bars missing from Grid Panel


    I am porting over to v4. Fun! (not.)

    My scrollbars are disappearing from my grid panel after reloading it.

    Here is the code the creates the grid:

    Code:
            var sitesData = { "records": [{
                id: "12893", 
                lat: "47.3004", 
                lng: "-122.225",
                type: "2~8",
                listTypes: "LUST~UST",
                siteName: "CENEX HARVEST STATES COOPERATIVES",
                riskLevel: "2",
                street: "238 8TH SE",
                city: "AUBURN",
                state: "WA",
                ZIP: "98002",
                siteids: "WALUSTIS-2487~WAUSTLIS-2487"
            }],
            success: true,
            totalCount: 1
            };
    
    
            Ext.define('Record', {
                extend: 'Ext.data.Model',
                fields: [
                        {name: "id", type: 'string'}, 
                        {name: "lat", type: 'float'}, 
                        {name: "lng", type: 'float'}, 
                        {name: "type", type: 'string'}, 
                        {name: "listTypes", type: 'string'}, 
                        {name: "siteName", type: 'string'}, 
                        {name: "riskLevel", type: 'string'}, 
                        {name: "street", type: 'string'}, 
                        {name: "city", type: 'string'}, 
                        {name: "state", type: 'string'}, 
                        {name: "ZIP", type: 'string'}, 
                        {name: "siteids", type: 'string'}
                ]
            });
            
            var gridStore = Ext.create('Ext.data.Store', {
                autoLoad: true,
                model: 'Record',
                data: sitesData,
                proxy: {
                    type: 'memory',
                    reader: {
                        type: 'json',
                        root: 'records',
                        totalProperty: 'totalCount'
                    }
                }
            });
            
            this.activeDetailsGrid = {
                xtype: 'grid',
                store: gridStore,
                selType: 'rowmodel',
                autoScroll: true,
                id: 'grid-panel',
                columns: [
                      { id: 'subjectHit', header: "S", width: 25, sortable: true, renderer: Layout.subjectHit, dataIndex: 'subjectHit' },
                      { id: 'id', header: "Site ID", width: 50, sortable: true, dataIndex: 'id' },
                      { text: "Site Name", width: 150, sortable: true, dataIndex: 'siteName' },
                      { text: "Street", width: 150, sortable: true, dataIndex: 'street' },
                      { text: "City", width: 75, sortable: true, dataIndex: 'city' },
                      { text: "ST", width: 30, sortable: true, dataIndex: 'state' },
                      { text: "ZIP", width: 50, sortable: true, dataIndex: 'ZIP' },
                      { text: "Risk", width: 50, sortable: true, dataIndex: 'riskLevel', renderer: Layout.checkRiskLevel},
                      { text: "Site Types", width: 125, sortable: true, dataIndex: 'listTypes' },
                ]
            };
    I am using the sitesData var is used to provide some data to create the grid. This is a holdover from v3.x - may not be needed in v4?

    I have a horizontal scrollbar as expected.

    Then I create my real data in a new sitesData variable and call this:

    Code:
    Layout.activeDetailsGrid.store.loadRawData(sitesData);
    My data in loaded into the grid as expected, but the scrollbars disappear. I should have both scrollbars.

    Any clues why this is happening? I am using 4.0.7.

    Thanks!
    Brad

  2. #2
    crysfel's Avatar
    Join Date
    Feb 2008
    Location
    New York, USA
    Posts
    216
    Vote Rating
    8
    crysfel will become famous soon enough

      1  

    Default


    Scrolls are really buggy in Ext4

    Try to add this fix to your code https://gist.github.com/1373631 probably works for you too.

    Some times the scroll stop working the above code fix that, maybe works for you too

    Cheers

  3. #3
    Sencha Premium Member vadimv's Avatar
    Join Date
    Sep 2010
    Location
    Chisinau, Moldova
    Posts
    642
    Vote Rating
    25
    vadimv will become famous soon enough vadimv will become famous soon enough

      0  

    Default


    Quote Originally Posted by crysfel View Post
    Scrolls are really buggy in Ext4

    Cheers
    Very probably, I have a grid panel in a card layout, and if I set the viewConfig with autoScroll true, then I get 2 scrollbars, one of the "gridview" and one of the "x-panel". Wanted and still want only for "gridview" but haven't found yet how to disable panel's one. So I had to set autoscroll to false in viewConfig in order to have only one scroll bar, which is for panel. And more than this, using rowexpander sometimes the scroller is buggy too. I'm not 100% sure, that these are bugs, but just complaining on what I get.

  4. #4
    Sencha Premium Member vadimv's Avatar
    Join Date
    Sep 2010
    Location
    Chisinau, Moldova
    Posts
    642
    Vote Rating
    25
    vadimv will become famous soon enough vadimv will become famous soon enough

      0  

    Default


    there's way how to disable the "gridscroller" ?

  5. #5
    Sencha Premium Member vadimv's Avatar
    Join Date
    Sep 2010
    Location
    Chisinau, Moldova
    Posts
    642
    Vote Rating
    25
    vadimv will become famous soon enough vadimv will become famous soon enough

      0  

    Default


    ouch, found it, "scroll" property.
    Quote Originally Posted by vadimv View Post
    there's way how to disable the "gridscroller" ?

  6. #6
    Sencha User
    Join Date
    Jul 2008
    Posts
    64
    Vote Rating
    1
    bradlymathews is on a distinguished road

      0  

    Default


    @crysfel and @phoenix06

    That did not work for me. When my grid is first initialized with the test data, I now get two horizontal scrollbars, but when I reload with new data, all scrollbars disappear.

    I am going to see if I can hack the grid by injecting the right overflow tags into the grid's CSS. Also, maybe if I wrap the grid in another panel and make that scrollable. Wish me luck. I will report back.

    Edit: I was just looking at the DOM and the CSS and it shows my grid-panel to be 2042px tall which explains the lack of vertical scrollbar. The width is showing at 291px which appears correct. overflow is set to hidden.

    - Brad

  7. #7
    Ext JS Premium Member phoenix06's Avatar
    Join Date
    Dec 2010
    Location
    Sophia Antipolis - France
    Posts
    34
    Vote Rating
    0
    phoenix06 is on a distinguished road

      0  

    Default


    I have the same problem in two project. I'll test your fix and come back with results.

    http://www.sencha.com/forum/showthre...032#post681032

    Thanks

  8. #8
    Ext JS Premium Member phoenix06's Avatar
    Join Date
    Dec 2010
    Location
    Sophia Antipolis - France
    Posts
    34
    Vote Rating
    0
    phoenix06 is on a distinguished road

      0  

    Smile


    This problem seems to have disappear, thanks a lot!

    I'll come back there in case of it reappear again.

    It's kind of a shame that I begin to have many workaround about the Ext4 release, I hope the 4.1 release will be better.

  9. #9
    crysfel's Avatar
    Join Date
    Feb 2008
    Location
    New York, USA
    Posts
    216
    Vote Rating
    8
    crysfel will become famous soon enough

      0  

    Default


    Quote Originally Posted by phoenix06 View Post
    It's kind of a shame that I begin to have many workaround about the Ext4 release, I hope the 4.1 release will be better.
    Yeah it's a shame, I've spent a lot of time fixing bugs for grids, editors, combos, etc... I have a lot of fixes and workarounds in my project the bright side is that I'm learning a lot XD

  10. #10
    Sencha User
    Join Date
    Nov 2010
    Posts
    46
    Vote Rating
    0
    paipai is on a distinguished road

      0  

    Default


    Thanks for sharing. There should be a release 4.0.8 including this fix (and all ohters) for users stuck in this version. Even after several days fixing my app I can't have something to work with 4.1b1
    Many application will be never updated in 4.1, there is too lot of work.