Javascript EXTJS 5-标记字段或组合框-显示和显示;隐藏表单字段
我想根据在多选组合框(tagfield)中选择的项目动态显示和隐藏表单中的字段 组合框中选择的每个项目都有几个关联的隐藏表单字段(要显示) 字段具有属性“hidden:true” 我可以显示字段,但当我从combobox字段或de tagfield中删除项目时,我不能隐藏它们Javascript EXTJS 5-标记字段或组合框-显示和显示;隐藏表单字段,javascript,combobox,hide,show,extjs5,Javascript,Combobox,Hide,Show,Extjs5,我想根据在多选组合框(tagfield)中选择的项目动态显示和隐藏表单中的字段 组合框中选择的每个项目都有几个关联的隐藏表单字段(要显示) 字段具有属性“hidden:true” 我可以显示字段,但当我从combobox字段或de tagfield中删除项目时,我不能隐藏它们 listeners:{ select:function( combo, records, eOpts) { var combo = Ext.ComponentQuery.query('
listeners:{
select:function( combo, records, eOpts) {
var combo = Ext.ComponentQuery.query('#combo')[0];
var field = Ext.ComponentQuery.query('#A')[0];
var field1 =Ext.ComponentQuery.query('#B')[0];
var field2 =Ext.ComponentQuery.query('#C')[0];
var records = combo.getValue();
console.log(records);
for (var i = 0, count = records.length; i < count; i++) {
switch(records[i]) {
case 'itemone':
if(field.isHidden()) {
field.show();
}
else {
field.hide();
}
break;
case 'itemtwo':
if(field1.isHidden()) {
field1.show();
}
else {
field1.hide();
}
break;
case 'itemthree':
if(field2.isHidden()) {
field2.show();
}
else {
field2.hide();
}
break;
}
}
}
}
隐藏:
你能给我一些建议来修改代码吗
注意:很抱歉之前的下一篇文章放错了位置
我试图实现你的建议,但没有成功(初学者的困难)
我的代码:
listeners:{
select:function( combo, records, eOpts) {
var combo = Ext.ComponentQuery.query('#combo')[0];
var fields = Ext.ComponentQuery.query('[autoHideTag]');
var records = combo.getValue();
console.log(records);
for (var i = 0, count = records.length; i < count; i++) {
fields.setVisible(records.indexOf(fields.autoHideTag) !== -1 );
switch(records[i]) {
case 'itemone':
if(field.isHidden()) {
field.show();
}
else {
field.hide();
}
break;
case 'itemtwo':
if(field1.isHidden()) {
field1.show();
}
else {
field1.hide();
}
break;
case 'itemthree':
if(field2.isHidden()) {
field2.show();
}
else {
field2.hide();
}
break;
}
}
}
}
侦听器:{
选择:功能(组合、记录、EOPT){
var combo=Ext.ComponentQuery.query('#combo')[0];
var fields=Ext.ComponentQuery.query(“[autoHideTag]”);
var records=combo.getValue();
控制台日志(记录);
for(var i=0,count=records.length;i
萤火虫说:
TypeError:fields.setVisible不是函数
你能帮我提些建议吗
谢谢。事实上,您的代码有一个逻辑缺陷。您使所有字段都可见,但是当您删除第三个标记时,会发生什么?您在组合框中循环当前选定的标记,显示时,您有
[“itemone”、“itemtwo”]
,其中没有“itemthree”。因此,您的最后一个案例,可能隐藏第三个字段的案例是note-executed。依此类推第二个和第一个标记
相反,我要做的是循环遍历每个字段,如果选择了标记,则显示它,如果没有选择,则隐藏它。您可以使用记录。indexOf('itemone')!==-1
例如,测试是否选择了标签
另一个技巧是,我将为字段使用一个具有独特名称的自定义属性,这样既可以简化组件查询,又可以无意识地知道要根据所选标记进行测试的标记
这就是我的意思。。。如果以这种方式定义字段:
{
xtype: 'textfield'
,autoHideTag: 'itemone' // custom marker
}
您可以在一个查询中获取所有字段:
// select all components with property autoHideTag resolving to something truthy
var fields = Ext.ComponentQuery.query('[autoHideTag]');
如果需要,您可以使查询更加具体,如“textfield[autoHideTag]”或“field[autoHideTag]”
最后,您将知道该字段要测试的标记:
// setting a component visible or hidden when it is already the case has no side-effect
field.setVisible( records.indexOf(field.autoHideTag) !== -1 );
瞧。玩得开心
// select all components with property autoHideTag resolving to something truthy
var fields = Ext.ComponentQuery.query('[autoHideTag]');
// setting a component visible or hidden when it is already the case has no side-effect
field.setVisible( records.indexOf(field.autoHideTag) !== -1 );