表单中,有“是否教师”的字段,如果该字段为“是”,则显示应聘的学科,如果“不是”,则隐藏应聘学科表单组件。
这里用radioGroup组件来实现“是否教师”字段,代码如下:
{
width : 200,
xtype: "radiogroup",
fieldLabel : "是否教师系列",
layout: "column",
allowBlank : false,
border: false,
name: "isTeacher",
id: "isTeacher",
items:[{
boxLabel: "是",
name: "isTeacher",
inputValue: "是"
},{
boxLabel: "否",
name: "isTeacher",
inputValue: "否",
checked: true
}],
listeners: {
"change": function() {
if (Ext.getCmp("isTeacher").getValue().inputValue == "是") {
Ext.getCmp("fieldEmploy").setVisible(true);
} else {
Ext.getCmp("fieldEmploy").setVisible(false);
}
}
}
}
主要是添加change事件,监听radioGroup取值的变化,在每次变化时判断取值,根据取值决定是否显示目标字段。
需要注意的是:radioGroup中定义选项时需要配置inputValue,这是传递的参数,即选中该选项时,向外界传递的参数。
其中fieldEmploy字段的定义没有在这里写,这个可以根据自己的需求进行定义。最终执行的效果如下:
初始默认“是否教师”为“否”,所以不显示“应聘学科”字段:
选择“是”之后,显示如下: