下拉框通过监听值改变事件改变下拉数据

案例效果

实际场景：自定义弹出的表单中,两个下拉框通过监听值改变事件返回数据

实现思路

1. 使用JE.win()自定义弹出表单
2. A字段数据变化，B字段跟着变，所以添加A字段的值改变事件

操作步骤

1. 使用JE.win()自定义弹出表单

2. A字段数据变化，B字段跟着变，所以添加A字段的值改变事件

相关代码

function(btn,event,eOpts){
    JE.win({
        title:'调试',
        width:600,
        height:500,
        xtype:'panel',
        useButton:true,//显示确定取消按钮
        items:[{
            xtype:'form',
            border:0,
            margin:'10px 10px 10px 10px',
            layout: {
                type: 'vbox',
                align : 'stretch',
                pack  : 'start',
            },
            items:[{
                fieldLabel:"调试类型",
                xtype:'cbbfield',
                //configInfo : 'JE_YL_CASE_STATUS,ALWD_TSLX_NAME~ALWD_TSLX_CODE,text~code,S',
                //调试类型默认显示数据
                dataArray:[
                    {code:'0',text:'调试本地'},
                    {code:'1',text:'调试线上'}
                ],
                labelWidth:70,
                maxLength:'50',//最大长度
                name:'ALWD_TSLX', //名称 
                allowBlank:false,//是否为空
                emptyText:"请选择类型", //空文本
                value:"请选择类型",
                //添加监听
                listeners:{
                    //监听值改变事件  field当前字段，newValue新值 oldValue旧值
                    change:function(field,newValue,oldValue){
                        var form =  field.up("form");
                        var cbbfield= form.down("[name=ALWD_TSJD]");
                        if(newValue=="0" || newValue=="调试本地"){
                            cbbfield.getStore().loadData([{code:'0',text:'本地进行中'},{code:'1',text:'本地已完成'}]);
                        }else{
                            cbbfield.getStore().loadData([{code:'2',text:'线上进行中'},{code:'3',text:'线上已完成'}]);
                        }
                    }
                }
            },{
                fieldLabel:"调试进度",
                xtype:'cbbfield',
                //configInfo : 'JE_YL_CASE_STATUS,ALWD_TSLX_NAME~ALWD_TSLX_CODE,text~code,S',
                //调试类型默认显示数据
                dataArray:[
                    {code:'0',text:'本地进行中'},
                    {code:'1',text:'本地已完成'},
                    {code:'2',text:'线上进行中'},
                    {code:'3',text:'线上已完成'}
                ],
                labelWidth:70,
                maxLength:'50',//最大长度
                name:'ALWD_TSJD', //名称 
                allowBlank:false,//是否为空
                emptyText:"请选择调试进度", //空文本
                value:"",
            }]

         }],
        autoShow:true,
        okButtonText:'确定',
        fn:function(win){
            //获取当前弹出窗口form
            var  form = win.down("[xtype=form]");
            //关闭窗口
            win.close();
        }
    });
}

关键字，相关问题

• 下拉框值改变
• 监听事件