Ir para conteúdo


Foto

Filtrar store de grid localmente

store filter grid local

Melhor Resposta Wemerson Januario , 26 April 2016 - 11:52

use filter ao invés de load. load irá tentar ir de forma remota.

seuStore.filter({
                    property: 'data_ponto',
                    //value: Ext.Date.format(value, 'Y-m-d')
                    value: value
                });

Fiz um fiddle demonstrando. Veja:

https://fiddle.sencha.com/#fiddle/199u

Visualizar todo o conteúdo do post


  • Por favor, faça o login para responder
10 respostas neste tópico

#1 Marcelo Augusto

Marcelo Augusto

    Member Avançado

  • Membros
  • PipPipPip
  • 232 posts
  • LocationCaicó, Rio Grande do Norte

Postado 26 April 2016 - 10:09

Olá, pessoal

 

Preciso filtrar os dados de um grid a partir de uma data a ser selecionada de um datefield. Porém, gostaria de fazer isso localmente.

Já tentei das seguintes formas, onde na primeira o grid continuou da mesma forma e na segunda nada foi retornado.

{
	xtype: 'datefield',					
	emptyText: 'dd/mm/aaaa',					
	enableKeyEvents: true,
	listeners: {						
		select: function(field, value, e0pts) {
                          var store = Ext.getStore('pontoeletronico');
			/*store.load({
				filters: [
					{
						property: 'dataPonto',
						value: Ext.Date.format(value, 'Y-m-d')
					}
				]
			});*/
			//store.proxy.extraParams.dataPonto = Ext.Date.format(value, 'Y-m-d');
			//store.load();
                 }
}

Agradeço a ajuda desde já..



#2 Wemerson Januario

Wemerson Januario

    Administrador Ext JS Brasil

  • Administrators
  • 857 posts
  • LocationGoiânia - GO

Postado 26 April 2016 - 11:52   Melhor Resposta

use filter ao invés de load. load irá tentar ir de forma remota.

seuStore.filter({
                    property: 'data_ponto',
                    //value: Ext.Date.format(value, 'Y-m-d')
                    value: value
                });

Fiz um fiddle demonstrando. Veja:

https://fiddle.sencha.com/#fiddle/199u


  • ratamiette e Marcelo Augusto curtiram isso

Wemerson Januario
http://wemersonjanuario.com.br
Twitter: @januariocoder

 

Treinamento e Consultoria Ext JS. Qualifique-se já!


#3 Marcelo Augusto

Marcelo Augusto

    Member Avançado

  • Membros
  • PipPipPip
  • 232 posts
  • LocationCaicó, Rio Grande do Norte

Postado 27 April 2016 - 08:58

Wemerson, deu certo pra filtrar a primeira vez. Por exemplo, eu filtro pra mostrar os pontos de hoje e ele aparece. Se eu colocar outra data depois, nenhum registro é retornado.



#4 Marcelo Augusto

Marcelo Augusto

    Member Avançado

  • Membros
  • PipPipPip
  • 232 posts
  • LocationCaicó, Rio Grande do Norte

Postado 27 April 2016 - 10:23

Wemerson, coloquei um clearFilter() antes de fazer de fato o filtro e tá funcionando legal agora. Porém, percebi que não tinha como retornar todos os registros sem ter que fechar o grid pra que ele seja renderizado de novo. Aí usei do evento change pra verificar se o valor do campo está nulo e retornar todos os dados novamente. Vou deixar o código de como ficou e caso tenha mais alguma sugestão, fala aí! Muito obrigado pela ajuda, cara!

{
	xtype: 'datefield',					
	emptyText: 'dd/mm/aaaa',					
	enableKeyEvents: true,
	listeners: {						
		select: function(field, value, e0pts) {
			var store = Ext.getStore('pontoeletronico');
			store.clearFilter();
			store.filter({
				property: 'dataPonto',
				value: value
			});						
		},
		keypress: function(field, e, options) {
			if(e.getKey() == e.ENTER) {								
				var store = Ext.getStore('pontoeletronico');
				store.clearFilter();
				store.filter({
					property: 'dataPonto', 
					value: field.getValue()
				});																							
			} 
		},
		change: function(thisComponent, newValue, oldValue, e0pts) {							
			if(newValue == null) {
				var store = Ext.getStore('pontoeletronico');
				store.clearFilter();	
			}								
		}
        }
},


#5 Wemerson Januario

Wemerson Januario

    Administrador Ext JS Brasil

  • Administrators
  • 857 posts
  • LocationGoiânia - GO

Postado 27 April 2016 - 10:37

é isso mesmo, esqueci do clearFilter(). terá que limpar o filtro sempre senão vai sempre unir com o anterior.

 

Sobre sugestão,

Como agora está monitorando o evento change, talvez não precise implementar o select. pois o select dispara o change no fundo do panos.

 

tipo

change: function(thisComponent, newValue, oldValue, e0pts) {							
		if(newValue) {
		       var store = Ext.getStore('pontoeletronico');
			store.clearFilter();
			store.filter({
				property: 'dataPonto',
				value: value
			});
					
		}else{
			var store = Ext.getStore('pontoeletronico');
			store.clearFilter();
		}								
		}

tente só melhorar o código para não repetir  o mesmo código em eventos diferentes(change e keypress), criando um método que faça essa tarefa pra você. Nãoo mais tá excelente.

 

Abraços.


Wemerson Januario
http://wemersonjanuario.com.br
Twitter: @januariocoder

 

Treinamento e Consultoria Ext JS. Qualifique-se já!


#6 Marcelo Augusto

Marcelo Augusto

    Member Avançado

  • Membros
  • PipPipPip
  • 232 posts
  • LocationCaicó, Rio Grande do Norte

Postado 28 April 2016 - 08:39

Wemerson, onde posso definir o método que você indicou?



#7 Wemerson Januario

Wemerson Januario

    Administrador Ext JS Brasil

  • Administrators
  • 857 posts
  • LocationGoiânia - GO

Postado 28 April 2016 - 09:05

Se usar MVC/MVVM, defina no controller, ou senão usar mvc, defina como membro da sua view extendida mesmo.


Wemerson Januario
http://wemersonjanuario.com.br
Twitter: @januariocoder

 

Treinamento e Consultoria Ext JS. Qualifique-se já!


#8 Marcelo Augusto

Marcelo Augusto

    Member Avançado

  • Membros
  • PipPipPip
  • 232 posts
  • LocationCaicó, Rio Grande do Norte

Postado 28 April 2016 - 09:18

Wemerson, defini no controller o método e na minha view eu fiz como você fez no exemplo do fiddle, porém o seguinte erro apareceu logo ao renderizar o grid: Uncaught No method named "filtrarData"



#9 Wemerson Januario

Wemerson Januario

    Administrador Ext JS Brasil

  • Administrators
  • 857 posts
  • LocationGoiânia - GO

Postado 28 April 2016 - 14:41

se estiver usando extjs 4 não conseguirá usar métodos nomeados como string, está disponível apenas para extjs 5 pra frente. Neste caso defina o método no controller como fez e defina também os listeners da sua view controlada pelo mesmo controller.

 

No meu exemplo usei Ext JS 6 com MVVM. 


Wemerson Januario
http://wemersonjanuario.com.br
Twitter: @januariocoder

 

Treinamento e Consultoria Ext JS. Qualifique-se já!


#10 Marcelo Augusto

Marcelo Augusto

    Member Avançado

  • Membros
  • PipPipPip
  • 232 posts
  • LocationCaicó, Rio Grande do Norte

Postado 05 May 2016 - 07:32

Wemerson, acabei de perceber que quando eu tento fazer um filtro por um registro que não está na primeira página, nada é retornado.



#11 Wemerson Januario

Wemerson Januario

    Administrador Ext JS Brasil

  • Administrators
  • 857 posts
  • LocationGoiânia - GO

Postado 05 May 2016 - 13:36

Isso está acontecendo pois você está fazendo filtro local, ou seja apenas os dados que estão carregados no store.

Para resolver seu problema terá que habilitar o remoteFilter do store e implementar o esquema de filtro no seu backend (recomendado), filtro local para este caso não é o adequado.

 

abraços


  • Marcelo Augusto curtiu isso

Wemerson Januario
http://wemersonjanuario.com.br
Twitter: @januariocoder

 

Treinamento e Consultoria Ext JS. Qualifique-se já!






Tópicos que também usam as tags store, filter, grid, local:

0 usuário(s) está(ão) lendo este tópico

0 membros, 0 visitantes, 0 membros anônimos