ExtJs根据combo的选择值决定表单项的隐藏或者显示

最新推荐文章于 2021-08-20 09:31:23 发布

iteye_353

最新推荐文章于 2021-08-20 09:31:23 发布

阅读量278

点赞数

本例展示了如何在表单中通过combo组件的值来动态显示或隐藏textfield表单项，实现根据资格考试是否通过的逻辑控制界面元素的可见性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

“资格考试是否通过”是一个combo组件，”资格考试说明“是一个textfield，最初是隐藏的，如果combo的选择值为“是”，则显示该表单项，否则不显示。注意combo自检中的store数据源为passExam，需要定义。本例中定义为：

// 资格考试是否通过 var passExam = [ ["是", "是"],["无", "无"] ];
form表单中的定义如下：

{ width : 200, xtype: "combo", fieldLabel : "资格考试是否通过", name : "passExam", id: "passExam", emptyText: "请选择资格考试是否通过", mode: 'local', autoLoad: true, triggerAction: 'all', valueField: 'id',// 实际值 displayField: 'name',// 显示值 store: passExam,// 数据源 listeners: { // 根据选择的值来决定表项是否显示 "select": function() { if (Ext.getCmp("passExam").getValue() == "是") { Ext.getCmp("examNote").setVisible(true); } else { Ext.getCmp("examNote").setVisible(false); } } } }, { xtype: "textfield", width : 200, fieldLabel : "资格考试说明", name : "examNote", id: "examNote", hidden: true }