ExtJs之下拉框联动－前台纯JS实现

通过extJS实现下拉框联动，即有两个下拉框，其中一个的下拉选项是根据另一个下拉框所选择的数据而变化的。现在网上有同学实现过，其实现思路是针对其中一个的下拉框的select事件编写代码，通过替换另一个下拉框store的proxy，然后重新装载实现级联的。代码如下：

Js代码

1. listeners:{        
2.     select : function(combo, record, index){      
3.     childStore.proxy= new Ext.data.HttpProxy({url: 'loadByParentid.action?parentid=' + combo.value});      
4.         childStore.load();       
5.     }      
6. }  

而我这里要实现的级联是另一个思路：一开始装载所有的数据，然后通过过滤数据，实现数据的级联更新。举例如下：
我们需要客户选择所在省和所在市，通过下拉列表，先选择省，然后所在市的下拉列表中过滤出该省下的所有市，提供给用户选择。
数据库设计：建立代码、省市对应表，如：37－山东、3701－济南、3702－青岛、3703－淄博、…
在所在省下拉列表的store中，获取代码为两位长度的省市数据，这样将获取到所有的省名称列表
另外建立一个Store，检索代码长度超过两位长度的省市数据，这样将获取所有的市名称列表

Js代码

1. var provinceStore = new Ext.data.Store({      
2.     proxy: new