部分资料来自:《JavaScript凌厉开发-Ext详解实践》
1 ///<reference path="vswd-ext_2.0.2.js">
2 Ext.onReady(function() {
3 var cities = [['北京',
4 [
5 ['北京'],
6 ['通县'],
7 ['昌平'],
8 ['大兴'],
9 ['密云'],
10 ['顺义'],
11 ['平台']
12 ]],
13 ['广东',
14 [
15 ['潮州'],
16 ['汕头']
17 ]
18 ]
19 ];
20
21 var localProvince = new Ext.data.SimpleStore({
22 fields: ['provinces', 'cities'],
23 data: cities
24 });
25
26 var localcities = new Ext.data.SimpleStore({
27 fields: ['cities'],
28 data: []
29 });
30
31 var frm = new Ext.form.FormPanel({
32 title: 'combo',
33 width: 300,
34 autoHeight: true,
35 applyTo: 'con',
36 frame: true,
37 labelWidth: 50,
38 labelAlign: 'right',
39 items: [
40 {
41 xtype: 'combo',
42 triggerAction: 'all',
43 anchor: '80%',
44 fieldLabel: 'Provinces',
45 editable: false,
46 mode: 'local',
47 store: localProvince,
48 displayField: 'provinces',
49 name: 'provinces',
50 listeners: {
51 select: function(form, rec, index) {
52 frm.getForm().findField('cities').clearValue();
53 localcities.loadData(rec.get('cities'));
54 }
55 }
56 }, {
57 xtype: 'combo',
58 triggerAction: 'all',
59 anchor: '80%',
60 fieldLabel: 'cities',
61 editable: false,
62 name: 'cities',
63 mode: 'local',
64 displayField: 'cities',
65 store: localcities
66 }
67 ]
68 });
69 });
2 Ext.onReady(function() {
3 var cities = [['北京',
4 [
5 ['北京'],
6 ['通县'],
7 ['昌平'],
8 ['大兴'],
9 ['密云'],
10 ['顺义'],
11 ['平台']
12 ]],
13 ['广东',
14 [
15 ['潮州'],
16 ['汕头']
17 ]
18 ]
19 ];
20
21 var localProvince = new Ext.data.SimpleStore({
22 fields: ['provinces', 'cities'],
23 data: cities
24 });
25
26 var localcities = new Ext.data.SimpleStore({
27 fields: ['cities'],
28 data: []
29 });
30
31 var frm = new Ext.form.FormPanel({
32 title: 'combo',
33 width: 300,
34 autoHeight: true,
35 applyTo: 'con',
36 frame: true,
37 labelWidth: 50,
38 labelAlign: 'right',
39 items: [
40 {
41 xtype: 'combo',
42 triggerAction: 'all',
43 anchor: '80%',
44 fieldLabel: 'Provinces',
45 editable: false,
46 mode: 'local',
47 store: localProvince,
48 displayField: 'provinces',
49 name: 'provinces',
50 listeners: {
51 select: function(form, rec, index) {
52 frm.getForm().findField('cities').clearValue();
53 localcities.loadData(rec.get('cities'));
54 }
55 }
56 }, {
57 xtype: 'combo',
58 triggerAction: 'all',
59 anchor: '80%',
60 fieldLabel: 'cities',
61 editable: false,
62 name: 'cities',
63 mode: 'local',
64 displayField: 'cities',
65 store: localcities
66 }
67 ]
68 });
69 });