1. #1
    Sencha Premium Member sencha-dev2's Avatar
    Join Date
    Jun 2012
    Location
    France
    Posts
    59
    Answers
    2
    Vote Rating
    0
    sencha-dev2 is on a distinguished road

      0  

    Exclamation Answered: Store's behaving strangely

    Answered: Store's behaving strangely


    Hi, I have a widget that uses a gridpanel, combined to a form.

    I'm really sorry, but I hope it can be fixed quickly, cause it totally blocks me on my work and I can't go further...

    Here's a screenshot :

    screenAdresseWidget.jpg

    It has a trouble, cause I try to load in the form the data from the gridpanel's first item. When I do it, it throws an error saying that store's items are undefined. Then why does it display records on the grid ?

    When I click on the items, it works well, even if some fields are filled with 'nude' data. It is easy to correct.

    Here's the code of the component :

    Code:
    Ext.define('Infologis.view.Composants.FormulaireAdresse', {    extend: 'Ext.form.FieldSet',
        name: 'coordonneesPostales',
        title: '<img src="images/icons/AdressePostale.png" /> Coordonnees Postales',
        style: {backgroundColor: '#EFEFEF'},
        layout: 'vbox',
        alias: 'widget.formulaireAdresse',
        
        initComponent: function() {
            var me = this;
            
            Ext.applyIf(me, {
                items: [
                    {
                        xtype: 'form',
                        name: 'coordPostales',
                        layout: 'vbox',
                        style: {
                            backgroundColor: '#EFEFEF'
                        },
                        width: 359,
                        items: [
                            {
                                xtype: 'toolbar',
                                width: 359,
                                name: 'toolAdresse',
                                items: [
                                    {
                                        xtype: 'container',
                                        flex: 1
                                    },
                                    {
                                        xtype: 'button',
                                        name: 'ajoutAdresseTiers',
                                        iconCls: 'x-btn-text-icon',
                                        icon: 'images/icons/application_add.png',
                                        text: 'Ajouter'
                                    },
                                    {
                                        xtype: 'button',
                                        name: 'enregistrerAdresseTiers',
                                        iconCls: 'x-btn-text-icon',
                                        icon: 'images/icons/tick.png',
                                        text: 'Valider',
                                        hidden: true
                                    },
                                    {
                                        xtype: 'button',
                                        name: 'annulerAjoutAdresseTiers',
                                        iconCls: 'x-btn-text-icon',
                                        icon: 'images/icons/cancel.png',
                                        text: 'Annuler',
                                        hidden: true
                                    }
                                ]
                            },
                            {
                                xtype: 'fieldcontainer',
                                name: 'adresseStructure',
                                layout: 'hbox',
                                items: [
                                    {
                                        xtype: 'textfield',
                                        name: 'numeroVoie',
                                        emptyText: 'Num.',
                                        fieldLabel: 'Adresse ',
                                        enforceMaxLength: true,
                                        maxLength: "4",
                                        width: 156,
                                        labelWidth: 110,
                                        allowBlank: true
                                    },
                                    {
                                        xtype: 'combobox',
                                        name: 'idComplementNumeroRue',
                                        displayField: 'libelle',
                                        valueField: 'idComplementNumeroRue',
                                        queryMode:'local',
                                        store: 'ComplementNumeroRue',
                                        emptyText: 'Bis, Ter...',
                                        width: 36,
                                        allowBlank: true
                                    },
                                    {
                                        xtype: 'combobox',
                                        name: 'idTypeVoie',
                                        displayField: 'court',
                                        emptyText: 'Rue...',
                                        queryMode:'local',
                                        valueField: 'idTypeVoie',
                                        store: 'TypeVoie',
                                        width: 36,
                                        allowBlank: true
                                    },
                                    {
                                        xtype: 'textfield',
                                        name: 'nomVoie',
                                        emptyText: 'Nom de la voie',
                                        allowBlank: true,
                                        width: 122
                                    }
                                ]
                            },
                            {
                                xtype: 'fieldcontainer',
                                name: 'complementAdresseStructure',
                                items: [
                                    {
                                        xtype: 'textfield',
                                        name: 'complementAdresse',
                                        fieldLabel: 'Complement ',
                                        emptyText: 'ZI, Lieu-dit...',
                                        allowBlank: true,
                                        labelWidth: 110,
                                        width: 359
                                    }
                                ]
                            },
                            {
                                xtype: 'fieldcontainer',
                                name: 'villeStructure',
                                layout: 'hbox',
                                items: [
                                    {
                                        xtype: 'textfield',
                                        name: 'codePostal',
                                        maxLength: "5",
                                        enforceMaxLength: true,
                                        fieldLabel: 'Code Postal / Ville ',
                                        labelWidth: 110,
                                        width: 170,
                                        allowBlank: true,
                                        emptyText: 'Code Postal',
                                        enableKeyEvents: true,
                                        regex: /^\d{5}$/,
                                        regexText: 'Un code Postal est composé de 5 chiffres',
                                        listeners: {
                                            keyup: {
                                                fn: function(text) {
                                                    var val = text.getValue();
                                                    var len = val.length;
                                                    var cbo = text.up().down('combobox');
                                                    var store = cbo.store;
                                                    if(len > 3) {
                                                        store.filterBy(function(rec) {
                                                            var enr = rec.data.codePostal;
                                                            if(val.substring(0, len) == enr.substring(0, len))
                                                                return true;
                                                            else
                                                                return false;
                                                        });
                                                    }
                                                }
                                            }
                                        }
                                    },
                                    {
                                        xtype: 'combobox',
                                        name: 'idCommune',
                                        queryMode: 'local',
                                        minChars: 2,
                                        displayField: 'nomCommune',
                                        valueField: 'idCommune',
                                        store: 'Commune',
                                        allowBlank: false,
                                        emptyText: 'Ville',
                                        width: 186,
                                        listeners: {
                                            select: {
                                                fn: function(cbo, rec) {
                                                    if(typeof(rec[0]) != 'undefined') rec = rec[0];
                                                    var codeP = rec.data.codePostal;
                                                    cbo.up().down('textfield[name="codePostal"]').setValue(codeP);
                                                }
                                            },
                                            focus: {
                                                fn: function(cbo) {
                                                    if(cbo.up().down('textfield').value.length > 3) cbo.expand();
                                                }
                                            }
                                        }
                                    }
                                ]
                            },
                            {
                                xtype: 'textfield',
                                name: 'cedexAdresse',
                                allowBlank: true,
                                labelWidth: 110,
                                width: 359,
                                fieldLabel: 'CEDEX ',
                                emptyText: 'Cedex + numero boite postale',
                                listeners: {
                                    blur: {
                                        fn: function(text) {
                                            if(text.value != '' && typeof(text.value) != 'undefined')
                                                text.setValue(text.value.toUpperCase());
                                        }
                                    }
                                }
                            },
                            {
                                xtype: 'textfield',
                                name: 'pointRemise',
                                allowBlank: true,
                                labelWidth: 110,
                                width: 359,
                                fieldLabel: 'Point de remise ',
                                emptyText: 'i.e. Appartement 25... '
                            },
                            {
                                xtype: 'textfield',
                                name: 'localisationConstruction',
                                allowBlank: true,
                                labelWidth: 110,
                                width: 359,
                                fieldLabel: 'Localisation de la construction ',
                                emptyText: 'i.e. Batiment C...'
                            },
                            {
                                xtype: 'datefield',
                                name: 'dateEffet',
                                fieldLabel: 'Date d\'effet ',
                                format: 'd/m/Y',
                                labelWidth: 110,
                                width: 359,
                                allowBlank: false
                            },
                            {
                                xtype: 'checkbox',
                                name: 'facturation',
                                inputValue: 'true',
                                uncheckedValue: 'false',
                                labelWidth: 110,
                                fieldLabel: 'Facturation',
                                labelSeparator: ''
                            },
                            {
                                xtype: 'gridpanel',
                                name: 'hiddengridATDate',
                                width: 359,
                                maxHeight: 300,
                                overflowY: 'auto',
                                store: Ext.create('Infologis.store.AdressesTiersParDate'),
                                columns: { 
                                    items: [
                                        {
                                            xtype: 'gridcolumn',
                                            dataIndex: 'nomCommune',
                                            text: 'Commune',
                                            flex: 2
                                        },
                                        {
                                            xtype: 'gridcolumn',
                                            dataIndex: 'codePostal',
                                            text: 'Code Postal'
                                        },
                                        {
                                            xtype: 'datecolumn',
                                            dataIndex: 'dateEffet',
                                            text: 'Date',
                                            format: 'd/m/Y'
                                        },
                                        {
                                            xtype: 'booleancolumn',
                                            dataIndex: 'facturation',
                                            text: 'Facturation',
                                            trueText: 'Oui',
                                            falseText: 'Non'
                                        }
                                    ],
                                    defaults: {
                                        flex: 1,
                                        sortable: false,
                                        hideable: false
                                    }
                                },
                                listeners: {
                                    afterrender: {
                                        fn: function(grid) {
                                            var store = grid.store;
                                            var tool = grid.up().down('toolbar');
                                            bouton = tool.child('button[name="supprimerAdresseTiers"]');
                                            if (bouton) tool.remove(bouton);
                                            if(store.count() > 1) {
                                                tool.add(
                                                    {
                                                        xtype: 'button',
                                                        name: 'supprimerAdresseTiers',
                                                        icon: 'images/icons/application_delete.png',
                                                        iconCls: 'x-btn-text-icon',
                                                        text: 'Supprimer'
                                                    }
                                                );
                                            }
                                        }
                                    },
                                    itemclick: {
                                        fn: function(grid, rec) {
                                            grid.up().up().getForm().setValues(rec.data);
                                        }
                                    }
                                }
                            },
                            {
                                xtype: 'hidden',
                                name: 'idAdresse'
                            },
                            {
                                xtype: 'hidden',
                                name: 'idTiersPourAdresse'
                            }
                        ]
                    }
                ]
            });
            
            me.callParent(arguments);
        }
    });
    Here's the code of its controller :

    Code:
    Ext.define('Infologis.controller.ControleAdresse', {    extend: 'Ext.app.Controller',
        
        // Les Vues contrôlées
        views: [
            'Composants.FormulaireAdresse'
        ],
        
        models: [
            'AdressesTiersParDate'
        ],
        
        stores: [
            'AdressesTiersParDate'
        ],
        
        init: function() {
            this.control({
                'button[name="ajoutAdresseTiers"]':
                {
                    click: this.preparerFormulaireAjout
                },
                
                'button[name="enregistrerAdresseTiers"]':
                {
                    click: this.enregistrerAdresseTiers
                },
                
                'button[name="annulerAjoutAdresseTiers"]':
                {
                    click: this.annulationAjout
                },
                
                'button[name="supprimerAdresseTiers"]':
                {
                    click: this.supprimerAdresseTiers
                }
            });
        },
        
        preparerFormulaireAjout: function(btn) {
            var tool = btn.up();
            btn.hide();
            bouton = tool.child('button[name="supprimerAdresseTiers"]');
            if(tool.isAncestor(bouton)) bouton.hide();
            tool.child('button[name="enregistrerAdresseTiers"]').show();
            tool.child('button[name="annulerAjoutAdresseTiers"]').show();
            var ctn = tool.up();
            console.log(ctn);
            ctn.child('fieldcontainer[name="adresseStructure"] textfield[name="numeroVoie"]').setValue('');
            ctn.child('fieldcontainer[name="adresseStructure"] textfield[name="numeroVoie"]').focus(10, true);
            ctn.child('fieldcontainer[name="adresseStructure"] textfield[name="nomVoie"]').setValue('');
            ctn.child('fieldcontainer[name="villeStructure"] textfield[name="codePostal"]').setValue('');
            ctn.child('fieldcontainer[name="complementAdresseStructure"] textfield[name="complementAdresse"]').setValue('');
            ctn.child('textfield[name="cedexAdresse"]').setValue('');
            ctn.child('textfield[name="localisationConstruction"]').setValue('');
            ctn.child('textfield[name="pointRemise"]').setValue('');
            ctn.child('datefield[name="dateEffet"]').setValue(new Date());
            ctn.child('fieldcontainer[name="adresseStructure"] combobox[name="idComplementNumeroRue"]').select('');
            ctn.child('fieldcontainer[name="adresseStructure"] combobox[name="idTypeVoie"]').select('');
            ctn.up().down('hidden[name="idAdresse"]').setValue(-1);
        },
        
        enregistrerAdresseTiers: function(btn) {
            var form = btn.up().up();
            var param = form.getForm().getValues();
            var grid = Ext.ComponentQuery.query('fieldset[discrim="adresseECIndividu"] gridpanel[name="hiddengridATDate"]')[0];
            var store = grid.store;
            if(param.idAdresse == -1)
            {
                // création
                Ext.Ajax.request({
                    url: 'adressetiers/ajouter-adresse-tiers',
                    params: param,
                    method: 'POST',
                    success: function() {
                        var tool = btn.up();
                        btn.hide();
                        
                        bouton = tool.child('button[name="supprimerAdresseTiers"]');
                        if(tool.isAncestor(bouton)) bouton.show();
                        
                        bouton = tool.child('button[name="annulerAjoutAdresseTiers"]');
                        if(tool.isAncestor(bouton)) bouton.hide();
                        
                        tool.child('button[name="ajoutAdresseTiers"]').show();
                        
                        store.load({params: param.idTiersPourAdresse});
                        var first = store.first();
                        var rec = first.data;
                        form.getForm().setValues(rec);
                        
                        grid.fireEvent('afterrender', grid);
                        
                        var cbo = form.child('fieldcontainer[name="adresseStructure"] combobox[name="idTypeVoie"]');
                        var valeur = '';
                        if(rec.idTypeVoie != 0) valeur = cbo.store.findRecord('idTypeVoie', rec.idTypeVoie);
                        cbo.select(valeur);
                        
                        cbo = form.child('fieldcontainer[name="adresseStructure"] combobox[name="idComplementNumeroRue"]');
                        if(rec.idComplementNumeroRue != 0) 
                        {
                            valeur = cbo.store.findRecord('idComplementNumeroRue', rec.idComplementNumeroRue);
                        } else {
                            valeur = '';
                        }
                        cbo.select(valeur);
                        
                        cbo = form.child('fieldcontainer[name="villeStructure"] combobox[name="idCommune"]');
                        if(rec.idCommune != 0) {
                            cbo.fireEvent('select', cbo, first);
                            cbo.up().down('textfield').fireEvent('keyup', cbo.up().down('textfield'));
                            valeur = cbo.store.findRecord('idCommune', rec.idCommune);
                        } else {
                            valeur = '';
                        }
                        cbo.select(valeur);
                    }
                });
            }
        },
        
        annulationAjout: function(btn) {
            var grid = Ext.ComponentQuery.query('fieldset[discrim="adresseECIndividu"] gridpanel[name="hiddengridATDate"]')[0];
            var store = grid.store;
            var first = store.first();
            var rec = store.first().data;
            console.log(rec);
            var tool = btn.up();
            btn.hide();
            bouton = tool.child('button[name="supprimerAdresseTiers"]');
            if(tool.isAncestor(bouton)) bouton.show();
            tool.child('button[name="enregistrerAdresseTiers"]').hide();
            tool.child('button[name="ajoutAdresseTiers"]').show();
            var form = tool.up();
            form.getForm().setValues(rec);
            var cbo = form.child('fieldcontainer[name="adresseStructure"] combobox[name="idTypeVoie"]');
            var valeur = '';
            if(rec.idTypeVoie != 0) valeur = cbo.store.findRecord('idTypeVoie', rec.idTypeVoie);
            cbo.select(valeur);
            cbo = form.child('fieldcontainer[name="adresseStructure"] combobox[name="idComplementNumeroRue"]');
            if(rec.idComplementNumeroRue != 0) 
            {
                valeur = cbo.store.findRecord('idComplementNumeroRue', rec.idComplementNumeroRue);
            } else {
                valeur = '';
            }
            cbo.select(valeur);
            cbo = form.child('fieldcontainer[name="villeStructure"] combobox[name="idCommune"]');
            if(rec.idCommune != 0) {
                cbo.fireEvent('select', cbo, first);
                cbo.up().down('textfield').fireEvent('keyup', cbo.up().down('textfield'));
                valeur = cbo.store.findRecord('idCommune', rec.idCommune);
            } else {
                valeur = '';
            }
            cbo.select(valeur);
        },
        
        supprimerAdresseTiers: function(btn) {
            // nothing here for now
        }
    });
    and here's the function I call from the entire view's controller when I try to do it :

    Code:
    loadEtatCivilOnglet: function()    {
            var parent= Ext.getCmp('treePrincipal').getSelectionModel().getSelection()[0];
            var idBenef= parent.getId().substring(9);
            var pan= Ext.widget('panelBeneficiaire');
            var centre= pan.child('form[name="centre"]');
            var sud = pan.child('container[name="sud"]');
            
            pan.name='EtatCivil';
            
            
            //Chargement des donn꦳
            Ext.Ajax.request({
                url: 'beneficiaire/get-e-c',
                timeout: 3000,
                method: 'POST',
                params:{
                    'idBenef': idBenef
                },
                success: function(xhr) {
                    var res=Ext.JSON.decode(xhr.responseText);
                    res = res[0];
                    pan.setTitle('<img src="images/icons/identite.png" /> Etat civil ' + res.nomIndividu + ' ' + res.prenom);
                    centre.add(
                        {
                            xtype: 'container',
                            items: [
                                {
                                    xtype: 'formulaireECIndividu'
                                },
                                {
                                    xtype: 'formulaireRIB'
                                }
                            ]
                        },
                        {
                            xtype: 'container',
                            maxWidth: 50,
                            flex: 1
                        },
                        {
                            xtype: 'container',
                            layout: 'vbox',
                            items: [
                                {
                                    xtype: 'formulaireAdresse',
                                    discrim: 'adresseECIndividu'
                                },
                                {
                                    xtype: 'formulaireTel2',
                                    discrim: 'tableauTelephoneECIndividu'
                                },
                                {
                                    xtype: 'formulaireMail'
                                }
                            ]
                        }
                    );
                    var nord = pan.down('container[name="nord"]');
                    nord.add(
                        {
                            xtype: 'toolbar',
                            name: 'toolFicheBeneficiaire',
                            items: [
                                {
                                    xtype: 'container',
                                    flex: 1
                                },
                                {
                                    xtype: 'button',
                                    name: 'enregistrerEC',
                                    text: 'Enregistrer',
                                    iconCls: 'x-btn-text-icon',
                                    icon: 'images/icons/accept.png'
                                },
                                {
                                    xtype: 'button',
                                    name: 'annulerEC',
                                    text: 'Annuler',
                                    iconCls: 'x-btn-text-icon',
                                    icon: 'images/icons/cancel.png'
                                }
                            ]
                        }
                    );
                    centre.getForm().setValues(res);
                    var grid = Ext.ComponentQuery.query('fieldset[discrim="tableauTelephoneECIndividu"] gridpanel[name="coordTel"]')[0];
                    grid.store.discrim = "storeTelECIndividu";
                    grid.store.load({params: res.idTiersPourAdresse});
                    grid = Ext.ComponentQuery.query('fieldset[discrim="adresseECIndividu"] form[name="coordPostales"] gridpanel[name="hiddengridATDate"]')[0];
                    grid.store.load({params: res.idTiersPourAdresse});
                    var cbo = centre.child('container fieldset[name="formulaireECIndividu"] combobox[name="idCivilite"]');
                    cbo.select(cbo.store.findRecord('idCivilite', res.idCivilite));
                    cbo = centre.child('container fieldset[name="formulaireECIndividu"] combobox[name="idCommuneNaissance"]');
                    var rec = cbo.getStore().data.items[cbo.store.findExact('idCommune', res.idCommuneNaissance)];
                    cbo.select(rec);
                    cbo.fireEvent('select', cbo, rec);
                    
                    grid.store.discrim = 'storeHiddenATDate';
                    console.log(grid.getStore().items);
                    grid.fireEvent('itemclick', grid.child('gridview'), grid.getStore().items[0].data);
                    
                    res = centre.getValues();
                    storeCompEC.add(res);
                }
            });
            Ext.getCmp('centre').add(pan);
        }
    I hope I gave you all elements that'll help you understanding the problem.

    I saw that the reload method is not supported by what I'm pointing on. But the load one works well... And it is really a store.

    Please, help. Thanks in advance.

    -----------------

    PS: Please; forgive the mistakes, I'm French...
    Last edited by sencha-dev2; 24 Aug 2012 at 6:30 AM. Reason: apologies

  2. If I got to the code of interest...

    Code:
        store.load({params: param.idTiersPourAdresse});
        var first = store.first();
        var rec = first.data;
        form.getForm().setValues(rec);
    ... you did not wait for the store to load before trying to get the first record to load into the form. You would need to do that in a callback from the load call.

    Here's a link to the documentation on Store.load

  3. #2
    Sencha User carol.ext's Avatar
    Join Date
    Jun 2007
    Location
    Littleton, Colorado, USA
    Posts
    673
    Answers
    16
    Vote Rating
    20
    carol.ext will become famous soon enough carol.ext will become famous soon enough

      0  

    Default


    If I got to the code of interest...

    Code:
        store.load({params: param.idTiersPourAdresse});
        var first = store.first();
        var rec = first.data;
        form.getForm().setValues(rec);
    ... you did not wait for the store to load before trying to get the first record to load into the form. You would need to do that in a callback from the load call.

    Here's a link to the documentation on Store.load

  4. #3
    Sencha Premium Member sencha-dev2's Avatar
    Join Date
    Jun 2012
    Location
    France
    Posts
    59
    Answers
    2
    Vote Rating
    0
    sencha-dev2 is on a distinguished road

      0  

    Default


    Thanks a lot, carol.ext !

    I thought it would stop the code until load would be done... Thanks again !

Thread Participants: 1

Tags for this Thread

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi