Question

extjs4.0 ComboBox 组合框级联问题。第一个ComboBox 选择省份后，要求第二个ComboBox 出现该省的城市

我第一次选择“江苏”后，并没有正确显示。但是在此次选择之后的操作都正确。
代码：
<script type="text/javascript">
Ext.onReady(main);
function main()
{

var cityStore=new Ext.data.Store({
fields:['name'],data:[],autoSync:true
});

var city=new Ext.form.ComboBox({
fieldLabel: '城市',
displayField:'name',
autoSelect:true,
store:cityStore
});

var p=new Ext.data.Store({
fields:['name'],
data:[{'name':'江苏'},{'name':'福建'}]
}
);

var province=new Ext.form.ComboBox(
{ //省份选择ComboBox
fieldLabel: '省份',
store:p,
displayField:'name',
valueField:'name',
queryMode: 'local',
listeners:{
'select':function(event,select)
{
Ext.Ajax.request(
{
url: 'respCity.jsp',
params: {
selectP: select[0].data.name
},
success: function(response)
{
var cities=eval(response.responseText);
city.getStore().removeAll(false);
city.getStore().add(cities); //第一次运行没有得到效果

// city.setValue(cities[0].name); //设置选择的文本
cityStore.commitChanges();
}
});
}
}
});

form1=new Ext.FormPanel( {
renderTo:Ext.getBody(),
title:'问卷调查',
frame:true,
width:300,
items:[
province,
city
]
});

}
</script>
//其中后台返回的数据为:"[{name:'南京'},{name:'常州'}]"或者"[{name:'泉州'}]"
注意：仅是第一次没正常给出应有的城市

Answer 1

代码风格很不一样呢，我之前做的时候也遇到过这种问题，放佛是因为加载combobox和加载数据的先后问题造成的

解决的方法是，先加载combox，再加载数据，代码如下
Ext.onReady(function() {
//省份
new Ext.form.ComboBox({
id: 'SF',
//省份的数据自动加载
store: Ext.create('Ext.data.Store', {fields: ['name']}),
displayField: 'name',
valueField: 'name',
listeners:{
'blur': askCity
}
});
});

function askCity(){
Ext.Ajax.request({
url: 'xxx.jsp',
params: {
sf: Ext.get('SF').getValue()
},
success: function(response){
//这里不需要removeall了，因为回来的数据只会是该省份下的城市
var respText = Ext.decode(response.responseText);
Ext.get('cs').store.loadData(respText);
},
failure: function(response){
Ext.Msg.alert('意外', '请求数据时发生意外，请刷新页面');
}
});
}

//城市的combo第一次运行不加载数据，或者填个blankText: '请选择省份',

追问

我试了你的代码，好像不行。跟我的一样。
不过我发现了个规律：假设现在有ComboBox A 和B。初始化时A，B均不带数据，现在对A和B分别调用 A.getStore().loadData(respText)和 B.getStore().loadData(respText)会出现以下情况：
A数据被更新，B数据未被更新。
原因:在调用上述函数之前用户对A有过操作，而对B没有操作。
如果对B也有过操作，那么B的数据也会更新。
可这怎么解决呢？

Answer 2

在city组合框中加入 mode: 'local',属性描述，应该可以吧

var city=new Ext.form.ComboBox({
fieldLabel: '城市',
displayField:'name',
autoSelect:true,
mode: 'local',
store:cityStore
});