Extjs compositefield使用问题现在的排板是combobox fieltext comboxbox button在combobox选择后显示或隐藏fieldtext和combobox(autocomplete)但显示combobox(autocomplete)后的位置错了,覆盖了第一个comboxbox的位置如何选择后隐藏显示在同一个位置?
no->fieldtext
country->comboxboxExt.onReady(function(){
function searchStore(){
//var type=Ext.getCmp('search_type').getValue();
var _field=[
{name: 'id',mapping: 'id', type:'int'},
{name: 'name',mapping: 'name',type:'string'}
];
return new Ext.data.JsonStore({
proxy: new Ext.data.HttpProxy({
url: 'country/list',
method: 'GET'
}),
autoDestroy: true,
root: 'list',
totalProperty: 'total',
idProperty: 'id',
remoteSort: false,
fields: _field,
baseParams: {'show':'all'},
sortInfo: {field:'name', direction:'ASC'}
});
}
var search_form = new Ext.form.FormPanel({
renderTo: 'search_box',
autoHeight: true,
border: false,
bodyStyle: 'padding: 5px',
layout: 'fit',
items : [
{
xtype: 'compositefield',
items: [
{
id: 'search_type',
xtype: 'combo',
mode: 'local',
store: new Ext.data.ArrayStore({
fields: ['field', 'name'],
data: [
['no', 'Number'],
['country', 'Country']
]
}),
typeAhead: true,
hideTrigger: false,
triggerAction: 'all',
name: 'type',
hiddenName: 'type',
valueField: 'field',
displayField: 'name',
width: 150,
editable: false,
value: 'no',
listeners: {
'select': function(){
if(this.getValue()=="country"){
Ext.getCmp('search_q').hide();
Ext.getCmp('search_country').show();
}
else{
Ext.getCmp('search_q').show();
Ext.getCmp('search_country').hide();
}
}
}
},
{
id: 'search_q',
xtype: 'textfield',
name: 'q',
width: 150,
value: 'q'
},
{
id: 'search_country',
xtype: 'combo',
mode: 'remote',
store: searchStore(),
typeAhead: false,
hideTrigger: false,
triggerAction: 'all',
name: 'country',
hiddenName: 'country',
valueField: 'field',
displayField: 'name',
width: 150,
value: 'combo country',
hidden: true//set default hide
},
{
name : 'search_button',
xtype: 'button',
text: 'search'
// handler: doSearch
},
{
name : 'clear_button',
xtype: 'button',
text: 'clear'
//handler: clearSearch
}
]
}
]
});
});
no->fieldtext
country->comboxboxExt.onReady(function(){
function searchStore(){
//var type=Ext.getCmp('search_type').getValue();
var _field=[
{name: 'id',mapping: 'id', type:'int'},
{name: 'name',mapping: 'name',type:'string'}
];
return new Ext.data.JsonStore({
proxy: new Ext.data.HttpProxy({
url: 'country/list',
method: 'GET'
}),
autoDestroy: true,
root: 'list',
totalProperty: 'total',
idProperty: 'id',
remoteSort: false,
fields: _field,
baseParams: {'show':'all'},
sortInfo: {field:'name', direction:'ASC'}
});
}
var search_form = new Ext.form.FormPanel({
renderTo: 'search_box',
autoHeight: true,
border: false,
bodyStyle: 'padding: 5px',
layout: 'fit',
items : [
{
xtype: 'compositefield',
items: [
{
id: 'search_type',
xtype: 'combo',
mode: 'local',
store: new Ext.data.ArrayStore({
fields: ['field', 'name'],
data: [
['no', 'Number'],
['country', 'Country']
]
}),
typeAhead: true,
hideTrigger: false,
triggerAction: 'all',
name: 'type',
hiddenName: 'type',
valueField: 'field',
displayField: 'name',
width: 150,
editable: false,
value: 'no',
listeners: {
'select': function(){
if(this.getValue()=="country"){
Ext.getCmp('search_q').hide();
Ext.getCmp('search_country').show();
}
else{
Ext.getCmp('search_q').show();
Ext.getCmp('search_country').hide();
}
}
}
},
{
id: 'search_q',
xtype: 'textfield',
name: 'q',
width: 150,
value: 'q'
},
{
id: 'search_country',
xtype: 'combo',
mode: 'remote',
store: searchStore(),
typeAhead: false,
hideTrigger: false,
triggerAction: 'all',
name: 'country',
hiddenName: 'country',
valueField: 'field',
displayField: 'name',
width: 150,
value: 'combo country',
hidden: true//set default hide
},
{
name : 'search_button',
xtype: 'button',
text: 'search'
// handler: doSearch
},
{
name : 'clear_button',
xtype: 'button',
text: 'clear'
//handler: clearSearch
}
]
}
]
});
});
她只是继承了field.所以你得自己扩展compositefield使他具有类似container的方法.没有其他的方法可以用
http://www.denioy.com