1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82
|
// source de données Pays
var dataPays= new Ext.data.Store({
proxy: new Ext.data.ScriptTagProxy({
url: 'pays.php'
}),
// Définition du lecteur (format Json)
reader: new Ext.data.JsonReader({
root: 'pays',
totalProperty: 'nb',
id: 'id_pays'
}, [
{name: 'id_pays', mapping: 'id_pays'},
{name: 'nom_pays', mapping: 'nom_pays'}
])
});
dataPays.load();
// Template (format d'affichage dans la liste comboBox)
var tplPays = new Ext.XTemplate(
'<tpl for="."><div class="search-item">',
'<span><b>{nom_pays}</b>',
'</div></tpl>'
);
// mon formulaire
var myFormPanel = new Ext.FormPanel({
id: 'myFormPanel',
// url:
frame: true,
autoWidth: true, //largeur de la fenêtre
autoHeight: true, //hauteur de la fenêtre
labelAlign: 'right', //les labels s'aligneront a droite
bodyCfg: {tag:'center', cls:'x-panel-body'}, //on aligne tous les champs au milieu de la fenêtre
bodyStyle: 'padding:5p;margin:0px; ',
items: [{
xtype: 'combo',
fieldLabel: 'Pays',
id: 'combo_pays',
name: 'combo_pays',
allowBlank: false,
loadingText: 'Chargement en cours',
pageSize:20,
minChars:0,
style:'width:90%',
typeAhead: false,
hideTrigger:false,
itemSelector: 'div.search-item',
store: dataPays,
tpl: tplPays,
onSelect: function(record){
this.setValue(record.data.id_pays);
this.collapse();
getVilles(this.value);}
}, {
xtype: 'combo',
fieldLabel: 'Ville',
id: 'combo_ville',
name: 'combo_ville',
allowBlank: false,
store: []
}]
});
// ma fonction qui permet de mettre à jour ma combo 2 pour la liste des villes
function getVilles(arg) {
alert(arg);
var dataVille = new Ext.data.Store({
proxy: new Ext.data.ScriptTagProxy({
url: 'ville.php?pays='+arg
}),
reader: new Ext.data.JsonReader({
root: 'villes',
totalProperty: 'nb',
id: 'id_ville'
}, [
{name: 'id_ville', mapping: 'id_ville'},
{name: 'nom_ville', mapping: 'nom_ville'}
])
});
dataVille.load();
Ext.getCmp('combo_ville').store.loadData(dataVille);
} |
Partager