Javascript-форум (https://javascript.ru/forum/)
-   ExtJS (https://javascript.ru/forum/extjs/)
-   -   как подключить фильтр к гриду? (https://javascript.ru/forum/extjs/39906-kak-podklyuchit-filtr-k-gridu.html)

remember_me 16.07.2013 18:20

как подключить фильтр к гриду?
 
Делаю все как в http://docs.sencha.com/extjs/4.0.7/#...FiltersFeature ....
var filtersCfg = {
	ftype: 'filters',
	autoReload: false,
	local: true,
	filters: [
	{
		type: 'string',
		dataIndex: 'String1',
	},
	{
		type: 'string',
		dataIndex: 'String2'
	},
	{
		type: 'boolean',
		dataIndex: 'Boolean'
	},
	{
		type: 'date',
		dataIndex:'Date'
	}
	]
};

Ext.create('Ext.grid.Panel', {
	store: userStore,
	width: 500,
	height: 250,
	title: 'Test Grid',
	columns: [
		//....
	],
        filters: [filtersCfg],
	dockedItems: [{
		xtype: 'pagingtoolbar',
		store: userStore,
		dock: 'bottom',
		displayInfo: true
	}],
	layout: 'fit',
	renderTo: Ext.getBody()
}).filters;

Так же смотрел на етот пример http://dev.sencha.com/deploy/ext-4.0...ilter-local.js

skrudjmakdak 17.07.2013 12:14

рабочий пример:
http://docs.sencha.com/extjs/4.2.1/e...ter-local.html

skrudjmakdak 17.07.2013 12:35

вот, смотрите:
Запустил у себя, работает!

Ext.require([
    'Ext.grid.*',
    'Ext.data.*',
    'Ext.ux.grid.FiltersFeature',
    'Ext.toolbar.Paging',
    'Ext.ux.ajax.JsonSimlet',
    'Ext.ux.ajax.SimManager'
]);
Ext.onReady(function()
	{
Ext.define('User', {
	extend: 'Ext.data.Model',
	fields: [ 
		{name: 'String1', type:'string'},
		{name: 'String2', type:'string'},
		{name: 'Boolean', type:'boolean', defaultValue: true},
		{name: 'Date', type:'date'}
	]
});

var filters = {
	ftype: 'filters',
	encode: true,
	local: true,
	filters: [
		{
		type: 'boolean',
		dataIndex: 'Boolean'
		}]
	};
	
var userStore = Ext.create('Ext.data.Store', 
	{
	model: 'User',
	remoteSort: true,
	pageSize: 5,
	proxy:
		{
		type: 'memory',
		enablePaging: true,
		data: [
			{ String1: 'Name11', String2:'Name21', Boolean: true, Date:'08/14/2012'},
			{ String1: 'Name12', String2:'Name22', Boolean: false, Date:'01/30/2012'},
			{ String1: 'Name13', String2:'Name23', Boolean: false, Date:'12/12/2012'},
			{ String1: 'Name14', String2:'Name24', Boolean: true, Date:'08/22/2012'},
			{ String1: 'Name15', String2:'Name25', Boolean: true, Date:'10/11/2012'},
			{ String1: 'Name16', String2:'Name26', Boolean: false, Date:'10/01/2012'},
			{ String1: 'Name17', String2:'Name27', Boolean: true, Date:'05/11/2012'},
			{ String1: 'Name18', String2:'Name28', Boolean: true, Date:'02/11/2012'},
			{ String1: 'Name19', String2:'Name29', Boolean: true, Date:'09/16/2012'}],
		reader:
			{
			type: 'json'
			}
		},
	autoLoad: true
});


Ext.create('Ext.grid.Panel', {
	store: userStore,
	width: 500,
	height: 250,
	features: [filters],
	title: 'Test Grid',
	columns: [
		{
			text: 'String1',
			width: 100,
			hideable: false,
			dataIndex: 'String1'
		},
		{
			text: 'String2',
			width: 100,
			dataIndex: 'String2'
		},
		{
			text: 'Boolean',
			width: 50,
			dataIndex: 'Boolean'
		},
		{
			text: 'Date',
			width: 100,
			format:'d.m.Y',
			xtype: 'datecolumn',
			dataIndex: 'Date'
		}
	],
	dockedItems: [{
		xtype: 'pagingtoolbar',
		store: userStore,
		dock: 'bottom',
		displayInfo: true
	}],
	renderTo: Ext.getBody()
});

	});



п.с. тестил наверсии 4.2.1

remember_me 17.07.2013 16:04

skrudjmakdak, Очень большое спасибо!!!!!!!!!!!!!!!!:victory:


Часовой пояс GMT +3, время: 19:14.