I've hooked up a Grid panel to a BufferStore with the vertical paging scroller, and generally speaking, things work. However, when I filter the grid using the filter grid UI feature in examples, which also works, if the number of filtered rows exceeds the grid height, the scroll bar doesn't appear unless I invoke invalidateScroller() on the Grid panel.

My workaround for this, since I already have an event hooked to the store's load event, is to invalidate the scroller on load, and the scrollbar appears consistently.

PHP Code:
// Not all methods are included here - this is really intended to show how my Grid panel is wired.
 
Ext.Loader.setConfig({ enabledtrue });
Ext.Loader.setPath('Ext.ux''./ext-4.0-beta3/examples/ux');
Ext.require([
'Ext.grid.*',
'Ext.data.*',
'Ext.ux.grid.FiltersFeature',
'Ext.toolbar.Paging'
]);
 
        
app.getRoot = function(_dataURL) { return "Grid."; } 
 
        
// Register data Model (unique name based on DisplayItem) with ModelManager
        // Customize JSON field mappings here
        // If mapping property is not defined for a field, it is assumed that
        // the field points to a JSON element with the same name as the field
        
if (!Ext.ModelManager.getModel('Contacts')) {
            
Ext.ModelManager.registerType('Contacts', { fields: [
                  { 
name"RecordNumber"        mapping"RecordNumber"        type"string" }
                , { 
name"TypeDescr"           mapping"TypeDescr"           type"string" }
                , { 
name"Number"              mapping"Number"              type"string" }
                , { 
name"FullName"            mapping"FullName"            type"string" }
                , { 
name"CompanyName"         mapping"CompanyName"         type"string" }
                , { 
name"UserName"            mapping"UserName"            type"string" }
                , { 
name"JobTitle"            mapping"JobTitle"            type"string" }
                , { 
name"FullAddress"         mapping"FullAddress"         type"string" }
                , { 
name"PhoneNumber"         mapping"PhoneNumber"         type"string" }
                , { 
name"StatusDescr"         mapping"StatusDescr"         type"string" }
                , { 
name"Children"            mapping"Children"            type"string" }
                , { 
name"ContactID"           mapping"ContactID"           type"string" }
                , { 
name"DataID"              mapping"DataID"              type"string" }
            ]}); 
        }
        
// Define Columns to be displayed in the Grid
        // Customize visibility, renderers, sortable, filterable, header text
        // Add/Remove a column definition when a new field is added/removed to/from the Model
        
var columns = [ 
              new 
Ext.grid.RowNumberer()
            , { 
dataIndex"TypeDescr"           text"Type"                hiddenfalsesortabletrue  }
            , { 
dataIndex"Number"              text"Number"              hiddenfalsesortabletrue 
                
rendererapp.renderCellContextMenu }
            , { 
dataIndex"FullName"            text"Name"                hiddenfalsesortabletrue  }
            , { 
dataIndex"CompanyName"         text"Company"             hiddenfalsesortabletrue  }
            , { 
dataIndex"UserName"            text"User Name"           hiddenfalsesortabletrue  }
            , { 
dataIndex"JobTitle"            text"Job Title"           hiddenfalsesortabletrue  }
            , { 
dataIndex"FullAddress"         text"Address"             hiddenfalsesortabletrue  }
            , { 
dataIndex"PhoneNumber"         text"Phone"               hiddenfalsesortabletrue  }
            , { 
dataIndex"StatusDescr"         text"Status"              hiddenfalsesortabletrue  }
            , { 
dataIndex"Children"            text""                    hiddentrue sortablefalse
                
rendererapp.renderCellContextMenu }
        ]; 
        
// Define filters against the column set / data Model
        
var filters = { 
              
ftype'filters'
            
encodefalse
            
localfalse
            
filters: [
                  { 
dataIndex"TypeDescr"           type"string" }
                , { 
dataIndex"Number"              type"string" }
                , { 
dataIndex"FullName"            type"string" }
                , { 
dataIndex"CompanyName"         type"string" }
                , { 
dataIndex"UserName"            type"string" }
                , { 
dataIndex"JobTitle"            type"string" }
                , { 
dataIndex"FullAddress"         type"string" }
                , { 
dataIndex"PhoneNumber"         type"string" }
                , { 
dataIndex"StatusDescr"         type"string" }
            ] 
        }; 
        
// Define Store object for the Grid
        
var store = new Ext.data.BufferStore({ 
            , 
model'Contacts'
            
sorters: []
            , 
autoLoadfalse 
            
remoteSorttrue
            
pageSize100 
            
proxy: {
                  
type'ajax'
                
url_dataUrl
                
extraParams: { format'JSON' }
                , 
encodeSortersapp.encodeSorters
                
reader: { 
                      
rootgetRoot_dataUrl ) + 'data'
                    
totalPropertygetRoot_dataUrl ) + 'total'
                  

              } 
        });
        
// Define the Grid itself
        
var grid = new ONEWARE.GridPanel(Ext.apply({
              
storestore
            
columnscolumns
            
features: [filters]
            , 
verticalScrollerType'paginggridscroller'
            
disableSelectiontrue
            
invalidateScrollerOnRefreshtrue
            
viewConfig: { trackOverfalse }
            , 
getRootgetRoot
        
}, params));
 
        
store.guaranteeRange(099); 
stevil