Package: | Ext.ux.grid |
Defined In: | GridFilters.js |
Class: | GridFilters |
Extends: | Object |
GridFilter is a plugin (ptype='gridfilters'
) for grids that
allow for a slightly more robust representation of filtering than what is
provided by the default store.
Filtering is adjusted by the user using the grid's column header menu (this menu can be disabled through configuration). Through this menu users can configure, enable, and disable filters for each column.
Features:
stateId
in the Grid configuration.
beforestaterestore
and beforestatesave
events in order to be stateful.
filters
property is added to the grid pointing to
this plugin.filterupdate
event is added to the grid and is
fired upon onStateChange completion.Example usage:
var store = new Ext.data.GroupingStore({
...
});
var filters = new Ext.ux.grid.GridFilters({
autoReload: false, //don't reload automatically
local: true, //only filter locally
// filters may be configured through the plugin,
// or in the column definition within the column model configuration
filters: [{
type: 'numeric',
dataIndex: 'id'
}, {
type: 'string',
dataIndex: 'name'
}, {
type: 'numeric',
dataIndex: 'price'
}, {
type: 'date',
dataIndex: 'dateAdded'
}, {
type: 'list',
dataIndex: 'size',
options: ['extra small', 'small', 'medium', 'large', 'extra large'],
phpMode: true
}, {
type: 'boolean',
dataIndex: 'visible'
}]
});
var cm = new Ext.grid.ColumnModel([{
...
}]);
var grid = new Ext.grid.GridPanel({
ds: store,
cm: cm,
view: new Ext.grid.GroupingView(),
plugins: [filters],
height: 400,
width: 700,
bbar: new Ext.PagingToolbar({
store: store,
pageSize: 15,
plugins: [filters] //reset page to page 1 if filters change
})
});
store.load({params: {start: 0, limit: 15}});
// a filters property is added to the grid
grid.filters
Config Options | Defined By | |
---|---|---|
autoReload : Boolean Defaults to true, reloading the datasource when a filter change happens.
Set this to false to prevent the datastore f... Defaults to true, reloading the datasource when a filter change happens.
Set this to false to prevent the datastore from being reloaded if there
are changes to the filters. See updateBuffer . | GridFilters | |
autoReload : Boolean Defaults to true, reloading the datasource when a filter change happens.
Set this to false to prevent the datastore f... Defaults to true, reloading the datasource when a filter change happens.
Set this to false to prevent the datastore from being reloaded if there
are changes to the filters. See updateBuffer . | GridFilters | |
encode : Boolean Specify true for buildQuery to use Ext.util.JSON.encode to
encode the filter query parameter sent with a remote reque... Specify true for buildQuery to use Ext.util.JSON.encode to
encode the filter query parameter sent with a remote request.
Defaults to false. | GridFilters | |
encode : Boolean Specify true for buildQuery to use Ext.util.JSON.encode to
encode the filter query parameter sent with a remote reque... Specify true for buildQuery to use Ext.util.JSON.encode to
encode the filter query parameter sent with a remote request.
Defaults to false. | GridFilters | |
filterCls : String The css class to be applied to column headers with active filters.
Defaults to 'ux-filterd-column'. | GridFilters | |
filterCls : String The css class to be applied to column headers with active filters.
Defaults to 'ux-filterd-column'. | GridFilters | |
filters : Array An Array of filters config objects. Refer to each filter type class for
configuration details specific to each filter... An Array of filters config objects. Refer to each filter type class for
configuration details specific to each filter type. Filters for Strings,
Numeric Ranges, Date Ranges, Lists, and Boolean are the standard filters
available. | GridFilters | |
filters : Array An Array of filters config objects. Refer to each filter type class for
configuration details specific to each filter... An Array of filters config objects. Refer to each filter type class for
configuration details specific to each filter type. Filters for Strings,
Numeric Ranges, Date Ranges, Lists, and Boolean are the standard filters
available. | GridFilters | |
local : Boolean true to use Ext.data.Store filter functions (local filtering)
instead of the default (false) server side filtering. | GridFilters | |
local : Boolean true to use Ext.data.Store filter functions (local filtering)
instead of the default (false) server side filtering. | GridFilters | |
menuFilterText : String defaults to 'Filters'. | GridFilters | |
menuFilterText : String defaults to 'Filters'. | GridFilters | |
paramPrefix : String The url parameter prefix for the filters.
Defaults to 'filter'. | GridFilters | |
paramPrefix : String The url parameter prefix for the filters.
Defaults to 'filter'. | GridFilters | |
showMenu : Boolean Defaults to true, including a filter submenu in the default header menu. | GridFilters | |
showMenu : Boolean Defaults to true, including a filter submenu in the default header menu. | GridFilters | |
stateId : String Name of the value to be used to store state information. | GridFilters | |
stateId : String Name of the value to be used to store state information. | GridFilters | |
updateBuffer : Integer Number of milliseconds to defer store updates since the last filter change. | GridFilters | |
updateBuffer : Integer Number of milliseconds to defer store updates since the last filter change. | GridFilters |
Method | Defined By | |
---|---|---|
addFilter( Object/Ext.ux.grid.filter.Filter config )
:
Ext.ux.grid.filter.FilterAdds a filter to the collection and observes it for state change. Adds a filter to the collection and observes it for state change. Parameters:
| GridFilters | |
addFilters( Array/Ext.grid.ColumnModel filters )
:
voidAdds filters to the collection. Adds filters to the collection. Parameters:
| GridFilters | |
bindStore( Store store )
:
voidChanges the data store bound to this view and refreshes it. Changes the data store bound to this view and refreshes it. Parameters:
| GridFilters | |
buildQuery( Array filters )
:
ObjectFunction to take the active filters data and build it into a query.
The format of the query depends on the encode
con... Function to take the active filters data and build it into a query.
The format of the query depends on the encode
configuration:
Parameters:
| GridFilters | |
cleanParams( Object p )
:
voidRemoves filter related query parameters from the provided object. Removes filter related query parameters from the provided object. Parameters:
| GridFilters | |
clearFilters()
:
void Turns all filters off. This does not clear the configuration information
(see removeAll). Turns all filters off. This does not clear the configuration information
(see removeAll). Parameters:
| GridFilters | |
getFilter( String dataIndex )
:
Ext.ux.grid.filter.FilterReturns a filter for the given dataIndex, if one exists. Returns a filter for the given dataIndex, if one exists. Parameters:
| GridFilters | |
getFilterClass( String type )
:
ClassFunction for locating filter classes, overwrite this with your favorite
loader to provide dynamic filter loading. Function for locating filter classes, overwrite this with your favorite
loader to provide dynamic filter loading. Parameters:
| GridFilters | |
getFilterData()
:
Array Returns an Array of the currently active filters. Returns an Array of the currently active filters. Parameters:
| GridFilters | |
removeAll()
:
void Remove all filters, permanently destroying them. Remove all filters, permanently destroying them. Parameters:
| GridFilters | |
saveState( Object grid , Object state )
:
BooleanSaves the state of all active filters Saves the state of all active filters Parameters:
| GridFilters | |
updateColumnHeadings()
:
void Update the styles for the header row based on the active filters Update the styles for the header row based on the active filters Parameters:
| GridFilters |