博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
extjs4.1:两个combobox的联动
阅读量:4654 次
发布时间:2019-06-09

本文共 2553 字,大约阅读时间需要 8 分钟。

    一个combobox读取县地址码,change时间发生后,第二个combobox列出该县所属乡地址码。

    第一个combobox的onComboboxChange事件中,处理县地址码,生成新的URL,更新乡store。

注意取得reference的不同之处:

1、取得乡镇下拉列表框的reference

var comboboxXiang = Ext.getCmp('comboboxXiang');

2、取得乡store的reference

var StoreXiang = Ext.data.StoreManager.lookup('StoreXiang');

 

StoreXiang.js

 

Ext.define('MyApp.store.StoreXiang', {    extend: 'Ext.data.Store',    requires: [        'MyApp.model.ModelXiang'    ],    constructor: function(cfg) {        var me = this;        cfg = cfg || {};        me.callParent([Ext.apply({            storeId: 'StoreXiang',            model: 'MyApp.model.ModelXiang',            proxy: {                type: 'ajax',                url: '/cgi-bin/wind.exe/read_xiang?xiandm=360102',                reader: {                    type: 'json',                    root: 'rows'                }            }        }, cfg)]);    }});

 

 

 

MyViewport.js

  

Ext.define('MyApp.view.MyViewport', {			extend : 'Ext.container.Viewport',			layout : {				type : 'border'			},			initComponent : function() {				var me = this;				Ext.applyIf(me, {							items : [{										xtype : 'panel',										region : 'west',										width : 271,										title : 'My Panel',										items : [{													xtype : 'combobox',													autoRender : true,													autoShow : true,													fieldLabel : '县区',													blankText : '请选择市',													emptyText : '请选择...',													displayField : 'MC',													store : 'StoreXian',													valueField : 'DM',													listeners : {														change : {															fn : me.onComboboxChange,															scope : me														}													}												}, {													xtype : 'combobox',													id : 'comboboxXiang',													autoRender : true,													store : 'StoreXiang',													displayField : 'MC',													valueField : 'DM',													fieldLabel : '乡镇',													blankText : '请选择市',													emptyText : '请选择...'																									}]									}]						});				me.callParent(arguments);			},			onComboboxChange : function(field, newValue, oldValue, options) {				var s = newValue.toString();				//取得地址码前六位:县代码				s = s.substr(0, 6);								//取得乡镇下拉列表框的reference				var comboboxXiang = Ext.getCmp('comboboxXiang');								//取得乡store的reference				var StoreXiang = Ext.data.StoreManager.lookup('StoreXiang'); 								StoreXiang.proxy.url = '/cgi-bin/wind.exe/read_xiang?xiandm=' + s;				StoreXiang.load();				//重置乡镇下拉列表框				comboboxXiang.clearValue();			}		});

转载于:https://www.cnblogs.com/cuibq/archive/2013/01/06/3801879.html

你可能感兴趣的文章
【UOJ 55】志愿者选拔
查看>>
Python -- pandas
查看>>
jQuery 效果 - 淡入淡出
查看>>
目标文件格式
查看>>
瑞士 -- 德语 德国 -- 德语 卢森堡 -- 德语 奥地利 -- 德语 丹麦 -- 丹麦语 挪威 -- 挪威语 爱尔兰 -- 爱尔兰语 荷兰 -- 荷兰语 比利时 -- 荷兰语...
查看>>
背景颜色设置
查看>>
推荐一款帮助负载均衡/DNS轮询服务器组使用的文件同步工具
查看>>
常用的CSS命名规则
查看>>
约数个数定理&约数和定理
查看>>
Oracle EBS数据定义移植工具:FNDLOAD
查看>>
判素数
查看>>
extjs4.1:两个combobox的联动
查看>>
百度地图瓦片工具:定义坐标
查看>>
jmeter控制器--交替控制器
查看>>
hdu 5365 Run
查看>>
jap _spring _maven
查看>>
IIS principle
查看>>
Oracle 如何对中文字段进行排序
查看>>
第七章 数组实验
查看>>
003_ElasticSearch详解与优化设计
查看>>