1. #1
    Sencha User
    Join Date
    Jun 2012
    Location
    N/A
    Posts
    18
    Vote Rating
    -2
    gizmoone has a little shameless behaviour in the past

      0  

    Default Search sencha touch expert for help with filter in store !

    Search sencha touch expert for help with filter in store !


    Hello

    To finish my first application of training, I try understand the philosophy for the party blind.


    I try to filter by the fields searchfield but not there arriving I already try by a simple function. That does not work not more.


    An expert it can help me the objective being to do that correctly with the architecture MVC.
    Thank you



    app/view/FonctionList.js
    Code:
    Ext.define('proto.view.FonctionList', {    extend: 'Ext.List',
        xtype: 'fonctionlist',
    	
        requires: ['proto.store.Fonctions',
    	'Ext.field.Search',
    	'Ext.plugin.ListPaging',
    	'Ext.plugin.PullRefresh'],
        
        config: {
            title: 'Liste des fonctions',
            grouped: true,
            itemTpl: '{Name} {Id}',
            store: 'Fonctions',
            onItemDisclosure: true,
    			handler: function(){
    							var sto = Ext.getStore('Fonctions');
    
                                    sto.clearFilter();
                                    sto.filter('Name', 'AGENT');
    							},
    		
    		items: [
                    {
                        xtype: 'toolbar',
                        docked: 'top',
    
    
                        items: [
                            { xtype: 'spacer' },
                            {
                                xtype: 'searchfield',
                                placeHolder: 'Search...'
    							
    				
                            },
                            { xtype: 'spacer' }
                        ]
                    }
                ]
        },
    	
    	
    
    
    });
    app/model/Fonction.js
    Code:
    Ext.define('proto.model.Fonction', {    extend: 'Ext.data.Model',
        config: {
    	  fields: [
            	{ name: 'Id',              type: 'string' },
    				{ name: 'Name',            type: 'string' },
    				{ name: 'Description',     type: 'string' }
    				 ]
        },
    
    
        fullName: function() {
            var d = this.data,
            names = [
       
    			d.Name,
    			d.Id
            ];
            return names.join(" ");
        }
    });

    app/store/Fonctions.js
    Code:
    Ext.define('proto.store.Fonctions', {    extend: 'Ext.data.Store',
    
    
        config: {
            model: 'proto.model.Fonction',
    		sorters: 'Name',
    		grouper : function(record) {
               
    	        return record.get('Name')[0];
            },
    		// proxy fichier 
            proxy: {
                type: 'ajax',
                url: 'data/liste.json',
        
    			reader: {
                    type: 'json',
                    rootProperty: 'post'
                }
            },    
            autoLoad: true,
            
    	}
    });

    app/controller/Fonction.js
    Code:
    Ext.define('proto.controller.Fonction', {    extend: 'Ext.app.Controller',
    
    
        config: {
            refs: {
                main: 'mainpanel'
            },
            control: {
                'fonctionlist': {
                    disclose: 'showDetail'
                }
            }
        },
    
    
        showDetail: function(list, record) {
            this.getMain().push({
                xtype: 'fonctiondetail',
                title: record.fullName(),
                data: record.getData()
            })
        }
    
    
    });

    app/view/Fonction.js
    Code:
    Ext.define('proto.view.Fonction', {    extend: 'Ext.navigation.View',
        xtype: 'mainpanel',
    	
        requires: [
            'proto.view.FonctionList',
            'proto.view.FonctionDetail'
        ],
    
    
        config: {
    		title: 'Fonctions',
    		iconCls: 'user',
            items:		[{
                xtype: 'fonctionlist'
    			
            }]
        }
    });

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,074
    Vote Rating
    854
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Does that code filter at all? Are you wanting to know how to filter based on what you tapped on in the list?

    handler isn't a config of the list also.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Jun 2012
    Location
    N/A
    Posts
    18
    Vote Rating
    -2
    gizmoone has a little shameless behaviour in the past

      0  

    Default


    I want to filter the content of lists it with what is typed in the research zone.


    But as I did not there arrive I tried to filter on the body previously but that does not work not more.
    From which my request on the forum.


    My question is therefore: how to configure the code to filter my list with what is typed in the research zone?


    Thank you

  4. #4
    Sencha User
    Join Date
    Jun 2012
    Location
    N/A
    Posts
    18
    Vote Rating
    -2
    gizmoone has a little shameless behaviour in the past

      0  

    Default


    Hello,
    I succeeded let the filter work thanks to the reading of different blogs.
    But the code isn't clean in the controller file.

    I have in a second time tried to integrate the call of the functions in the party control but that does not work.
    Code:
    control: {            'fonctionlist': {
                    disclose: 'showDetail'
                },
    			'#contact_search': { 
                    clearicontap: this.onSearchClearIconTap,  
                    keyup: this.onSearchKeyUp  
                   
    			}
    error message : Uncaught TypeError: Cannot call method 'apply' of undefined


    here the file controller that works
    Code:
    Ext.define('proto.controller.Fonction', {    extend: 'Ext.app.Controller',
    
    
        config: {
            refs: {
                main: 'mainpanel'
            },
            control: {
                'fonctionlist': {
                    disclose: 'showDetail'
                }
    			
            }
        },
    
    
        showDetail: function(list, record) {
            this.getMain().push({
                xtype: 'fonctiondetail',
                title: record.fullName(),
                data: record.getData()
            })
        },
    	
    	  init: function() {
    
    
            this.control({
    
    
                '#contact_search':{  
                    scope: this,
                    clearicontap: this.onSearchClearIconTap,
                    keyup: this.onSearchKeyUp
                }
    
    
            });
        },
        onSearchKeyUp: function(field) {
            
            var value = field.getValue(),
            store = Ext.getCmp('fonctionlist').getStore();    
    
    
            
            store.clearFilter();
    
    
            
            if (value) {
                
                var searches = value.split(' '),
                regexps = [],
                i;
    
    
                for (i = 0; i < searches.length; i++) {
    
    
                    if (!searches[i]) continue;
    
    
                 regexps.push(new RegExp(searches[i], 'i'));
                
    			}
    
    
                store.filter(function(record) {
                    var matched = [];
    
    
                    for (i = 0; i < regexps.length; i++) {
    					
                                  var search = regexps[i],
                 didMatch = record.get('Name').match(search) ;//||
                
                                   matched.push(didMatch);
    
    
                             } 
    console.log(matched.length);
                  if (regexps.length > 1 && matched.indexOf(false) != -1) {
                                  return false;
                              } else {
                                 return matched[0];
                                }
                });
            }
        },
    
    
        onSearchClearIconTap: function() {
            Ext.getCmp('fonctionlist').getStore().clearFilter();
        }
    	
    	
    
    
    });

    How to let the party go out control of the function init?

    thanks

Thread Participants: 1

Tags for this Thread