2010-07-20 6 views
1

J'ai eu un problème - dans ma grille j'ai lié deux combobox (pays et ville). Je choisis le pays et obtiens correctement toutes les villes (JSON), mais au prochain changement de pays combobox ma combobox de ville ne recharge pas. Qu'est-ce que je fais mal? Voici mon codeEXT JS combobox pas recharger les données

Ext.onReady(function(){ 
Ext.QuickTips.init(); 

var Organization = Ext.data.Record.create([{ 
    name: 'name_ru', 
    type: 'string' 
}, { 
    name: 'name_en', 
    type: 'string' 
}, { 
    name: 'type', 
    type: 'string' 
},{ 
    name: 'country', 
    type: 'string' 
},{ 
    name: 'town', 
    type: 'string' 
}]); 

var Town = Ext.data.Record.create([{ 
    name: 'id', 
    type: 'integer' 
}, { 
    name: 'name', 
    type: 'string' 
}]); 

Ext.namespace("Ext.ux"); 
Ext.ux.comboBoxRenderer = function(combo) { 
    return function(value) { 
    var idx = combo.store.find(combo.valueField, value); 
    var rec = combo.store.getAt(idx); 
    return rec.get(combo.displayField); 
    }; 
} 

var proxy1 = new Ext.data.HttpProxy({ 
    url: 'emp2.php' 
}); 

var writer = new Ext.data.JsonWriter({ 
    encode: true // В документации сказано если вы будете использовать rest то этот флаг нужно выставить в false 
}); 

var store4 = new Ext.data.GroupingStore({ 
    proxy: proxy1, 
    reader: new Ext.data.JsonReader({root: 'org',totalProperty: 6, id: 'name_ru'},[{name: 'name_ru'}, 
                       {name: 'name_en'}, 
                       {name: 'type'}, 
                       {name: 'country'}, 
                       {name: 'town'}]), 
    writer:writer, 
// restful: true,  
    root: 'emp', 
    sortInfo: {field: 'name_ru', direction: 'ASC'} 
}); 

getData = function(_req,_forVal) 
{ 
    var myStore = new Ext.data.Store({ 
     proxy: new Ext.data.HttpProxy({ 
      url: 'include/getRFB.php?'+_req+'='+_forVal, 
      method: 'POST', 
     totalProperty: 6 
     }), 
     reader: new Ext.data.JsonReader({ 
      id: 'id', 
      root:'town' 
     },[ 
      {name: 'id', mapping: 'id'}, 
      {name: 'name', mapping: 'name'} 
     ]), 
     remoteSort: true 
    }); 
// Ext.Msg.alert('Hello this is the title', myStore); 
    myStore.load(); 
    return myStore; 
} 

var townStore = new Ext.data.Store({ 
    proxy: new Ext.data.HttpProxy({ 
     url: 'include/getRFB.php?test=true', 
     method: 'POST' 
    }), 
    reader: new Ext.data.JsonReader({ 
     id: 'id', 
     root:'test', 
     totalProperty: 6 
    },[ 
     {name: 'id', mapping: 'id'}, 
     {name: 'name', mapping: 'name'} 
    ]), 
    remoteSort: true 
}); 



var countryStore = new Ext.data.Store({ 
    proxy: new Ext.data.HttpProxy({ 
     url: 'include/getRFB.php?country=true', 
     method: 'POST' 
    }), 
    reader: new Ext.data.JsonReader({ 
     id: 'id', 
     root:'country', 
     totalProperty: 6 
    },[ 
     {name: 'id', mapping: 'id'}, 
     {name: 'name', mapping: 'name'}, 
     {name: 'alpha2', mapping: 'alpha2'}, 
     {name: 'alpha3', mapping: 'alpha3'}, 
     {name: 'iso', mapping: 'iso'} 
    ]), 
    remoteSort: true 
}); 

var orgTypeStore = new Ext.data.Store({ 
    proxy: new Ext.data.HttpProxy({ 
     url: 'include/getRFB.php?orgtype=true', 
     method: 'POST' 
    }), 
    reader: new Ext.data.JsonReader({ 
     id: 'id', 
     root:'org_type', 
     totalProperty: 6 
    },[ 
     {name: 'id', mapping: 'id'}, 
     {name: 'name', mapping: 'name'} 
    ]), 
    remoteSort: true 
}); 

var comboTown = new Ext.form.ComboBox({ 
    store:townStore, 
    fieldLabel: 'Town', 
    displayField: 'name', 
    valueField: 'id', 
    typeAhead: true, 
    mode: 'local', 
    triggerAction: 'all', 

    name : 'town1', 


    id : 'town1', 
    emptyText : 'Выберите город...', 
    hiddenName : 'town_name', 
    width : 250, 
    anchor:'-50' 
}); 

var combo1 = new Ext.form.ComboBox({ 
    store:countryStore, 
    fieldLabel: 'Country', 
    displayField: 'name', 
    valueField: 'id', 
    typeAhead: true, 
    mode: 'local', 
    triggerAction: 'all', 



    name : 'country1', 
    id : 'country1', 
    emptyText : 'Выберите страну...', 
    hiddenName : 'country_name', 
    width : 250, 
    anchor:'-50', 
    listeners : { 
     select: function(f,r,i){ 
      // f=formfield r=data rec of selected combo item i=index num of clicked item 
      _forVal = this.getValue(); //get selected value of this comboBox 
      //comboTown.store.clearFilter(); 
      comboTown.store =getData('countryT',_forVal); //call function tht load store 
      comboTown.displayField = 'name'; 
      comboTown.reset(); 


     } 
    } 
}); 

var comboOrgType = new Ext.form.ComboBox({ 
    store:orgTypeStore, 
    fieldLabel: 'Name', 
    displayField: 'name', 
    valueField: 'id', 
    typeAhead: true, 
    mode: 'local', 
    triggerAction: 'all', 
    selectOnFocus: true, 
    name : 'orgtype1', 
    id : 'orgtype1', 
    allowBlank : false, 
    emptyText : 'Выберите тип...', 
    hiddenName : 'name', 
    width : 250, 
    anchor:'-50' 
}); 

countryStore.load(); 
orgTypeStore.load(); 
townStore.load(); 

var editor = new Ext.ux.grid.RowEditor({ 
    saveText: 'Обновить' 
}); 

store4.load(); 

var grid = new Ext.grid.GridPanel({ 
    store: store4, 
    width: 600, 
    region:'center', 
    margins: '0 5 5 5', 
    autoExpandColumn: 'name', 
    plugins: [editor], 

    view: new Ext.grid.GroupingView({ 
     markDirty: false 
    }), 
    tbar: [{ 
     iconCls: 'icon-user-add', 
     text: 'Добавить организацию', 
     handler: function(){ 
      var e = new Organization({ 
       name_ru: 'Наименование организации ру', 
       name_en: 'Наименование организации анг', 
       type: '1', 
       country: '2', 
       town: '2' 
      }); 
      editor.stopEditing(); 
      store4.insert(0, e); 
      grid.getView().refresh(); 
      grid.getSelectionModel().selectRow(0); 
      editor.startEditing(0); 
     } 
    },{ 
     ref: '../removeBtn', 
     iconCls: 'icon-user-delete', 
     text: 'Удалить организацию', 
     disabled: true, 
     handler: function(){ 
      editor.stopEditing(); 
      var s = grid.getSelectionModel().getSelections(); 
      for(var i = 0, r; r = s[i]; i++){ 
       store4.remove(r); 
      } 
     } 
    }], 

    columns: [ 
    new Ext.grid.RowNumberer(), 
    { 
     id: 'name', 
     header: 'Название организации(рус)', 
     dataIndex: 'name_ru', 
     width: 200, 
     sortable: true, 
     editor: { 
      xtype: 'textfield', 
      allowBlank: false 
     } 
    },{ 
     header: 'Название организации(eng)', 
     dataIndex: 'name_en', 
     width: 195, 
     sortable: true, 
     editor: { 
      xtype: 'textfield', 
      allowBlank: false, 
     } 
    },{ 
     header: 'Тип', 
     dataIndex: 'type', 
     width: 85, 
     sortable: true, 
     editor: comboOrgType, 
     renderer: Ext.ux.comboBoxRenderer(comboOrgType) 
    },{ 
     header: 'Страна', 
     dataIndex: 'country', 
     width: 90, 
     sortable: true, 
     editor: combo1, 
     renderer: Ext.ux.comboBoxRenderer(combo1) 
    },{ 
     header: 'Город', 
     dataIndex: 'town', 
     width: 90, 
     sortable: true, 
     editor: comboTown, 
     renderer: Ext.ux.comboBoxRenderer(comboTown) 
    }] 
}); 

//Ext.Msg.alert('Hello c'est le titre », store4.getCount());

var layout = new Ext.Panel({ 
    title: 'Список организаций', 
    layout: 'border', 
    layoutConfig: { 
     columns: 1 
    }, 
    width:720, 
    height: 600, 
    items: [grid] 
}); 
layout.render(Ext.get('editor-grid')); 

grid.getSelectionModel().on('selectionchange', function(sm){ 
    grid.removeBtn.setDisabled(sm.getCount() < 1); 
}); 

});

Merci!

Répondre

1

Je vais donner un coup de feu :)

Dans votre sélectionnez-auditeur danscombo1 (pays), vous définissez le magasin à l'aide du getData (...) méthode. La méthode getData (...) crée un nouveau magasin qui est chargé puis renvoyé. Je me souviens d'avoir des problèmes similaires une fois et la solution aurait pu être d'abord affecter le magasin à la combobox et puis charger le magasin.

Pour autant que je peux voir, vous utilisez getData (...) juste pour créer un nouveau magasin pour le combo ville . Pourquoi ne pas simplement mettre à jour les paramètres de la boutique de la ville , puis le recharger?

Hope it helps :)

+0

Merci. im essayer maintenant - charger les données à l'écouteur: comboTown.store.reload ({params: {'countryT': _forVal}}); Dans la charge de données firebug, mais la liste déroulante ne le charge pas :( –

+0

"affecter le magasin à la liste déroulante, puis charger le magasin." Ne pas réparer trop :( –