Javascript 根据组合框中不同的选定值绑定字段状态(禁用或隐藏)
我想根据组合框中不同的选定值绑定字段状态(禁用或隐藏) 如果在组合框中只选择一个选项,效果会很好 小提琴: 堆栈溢出: 我尝试了以下方法:Javascript 根据组合框中不同的选定值绑定字段状态(禁用或隐藏),javascript,extjs,binding,extjs5,Javascript,Extjs,Binding,Extjs5,我想根据组合框中不同的选定值绑定字段状态(禁用或隐藏) 如果在组合框中只选择一个选项,效果会很好 小提琴: 堆栈溢出: 我尝试了以下方法: bind: { disabled: ('{isAlabama} || {isAlaska}') }, 很明显,它是有效的。如果选择Alabama或Alaska,则Alabama字段将隐藏 问题是,当我选择组合框值时,应该显示字段 阿拉巴马州和阿拉斯加,这不,只是显示阿拉斯加 小提琴:编辑 有可能通过绑定实现这一点吗?我稍微重新编写了
bind: {
disabled: ('{isAlabama} || {isAlaska}')
},
很明显,它是有效的。如果选择Alabama或Alaska,则Alabama字段将隐藏
问题是,当我选择组合框值时,应该显示字段
阿拉巴马州和阿拉斯加,这不,只是显示阿拉斯加
小提琴:编辑
有可能通过绑定实现这一点吗?我稍微重新编写了公式,并将AL | AK逻辑移到了
hideAlabama
公式中,而不是在disabled属性中。这使得属性对单个公式求值保持隐藏状态,因为多个公式求值的行为似乎不符合预期
Ext.application({
name : 'Fiddle',
launch : function() {
}
});
var states = Ext.create('Ext.data.Store', {
fields: ['abbr', 'name'],
data : [
{"abbr":"AL", "name":"Alabama"},
{"abbr":"AK", "name":"Alaska"},
{"abbr":"AZ", "name":"Arizona"}
]
});
Ext.define('My.ViewModel', {
extend: 'Ext.app.ViewModel',
alias: 'viewmodel.myviewmodel',
formulas: {
hideAlabama: function(get) {
return get('comboboxvalue') === 'AL' || get('comboboxvalue') === 'AK';
},
hideAlaska: function(get) {
return get('comboboxvalue') === 'AK';
},
hideArizona: function(get) {
return get('comboboxvalue') === 'AZ';
}
}
});
Ext.create('Ext.form.Panel', {
title: 'Sign Up Form',
width: 300,
height: 230,
bodyPadding: 10,
margin: 10,
layout: {
type:'anchor',
align: 'stretch'
},
viewModel:{
type: 'myviewmodel'
},
items: [{
xtype: 'combobox',
fieldLabel: 'Choose State',
store: states,
queryMode: 'local',
displayField: 'name',
valueField: 'abbr',
reference:'combobox',
bind: {
value: '{comboboxvalue}'
}
},{
xtype: 'textfield',
fieldLabel: 'If Alabama, hide',
bind: {
hidden: '{hideAlabama}'
}
},{
xtype: 'textfield',
fieldLabel: 'If Alaska, hide',
bind: {
hidden: '{hideAlaska}'
}
},{
xtype: 'textfield',
fieldLabel: 'If Arizona, hide',
bind: {
hidden: '{hideArizona}'
}
}],
renderTo: Ext.getBody()
});