ExtJs RadioGroup根據選擇的值決定某些表單是否顯示

表單中，有“是否教師”的字段，如果該字段爲“是”，則顯示應聘的學科，如果“不是”，則隱藏應聘學科表單組件。

這裏用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字段的定義沒有在這裏寫，這個可以根據自己的需求進行定義。最終執行的效果如下：

初始默認“是否教師”爲“否”，所以不顯示“應聘學科”字段：

選擇“是”之後，顯示如下：