Layui--下拉框选值变更行级数据

Layui–下拉框选值变更行级数据

项目中有一个需要实现的功能，先看图：

要做到的效果是：
在通道一最右边的下拉框中选择通道的时候，当我选择了通道二的时候，通道一的内容会显示在我通道二的位置中。
思路是这样的，有不足的地方请大家多多斧正。
首先我们先将通道一中的各个组件都设定一个别名：从左至右分别为A、B、C、D、E。
1.先拿到E下拉框的id（因为我每个通道中的内容都是一一对应的）。

form.on("select", function (data) {
//拿到E下拉框的id
var obj = document.getElementById(id);
}

2.使用SWITCH 表达式来做要是哪个通道要做切换的判定，判定的依据是E下拉框的id

switch (obj) {

     case A:

     break;
}

3.在SWITCH表达式中，分别拿到A、B、C、D的值

 switch (obj) {
    
                                case 1: 
                                        //获取要切换到的通道值
                                        var aisle = data.value;                                        
                                        //获取A复选框的选中值                                      
                                        var a= $('input[name="A"]').prop("checked");
                                        //获取B复选框的选中值
                                        var b= $('input[name="B"]').prop("checked");
                                        //获取C下拉框的选中值
                                        var c= jQuery("#C").val();
                                        //获取D下拉框的选中值
                                        var d= jQuery("#D").val();

                                break; 
                                case 2: 
                                //根据第一个写
                                break;
                                 case 3: 
                                //根据第一个写
                                break;
                                 case 4: 
                                //根据第一个写
                                break;
                                }

   3.再一次使用SWITCH 表达式做要切换到的通道赋值与原被切换通道内容的清空（此处接收切换内容通道的为a1、b1、c1、d1  

switch (obj) {
    
                                case 1: 
                                        //获取要切换到的通道值
                                        var aisle = data.value;                                        
                                        //获取A复选框的选中值                                      
                                        var a= $('input[name="A"]').prop("checked");
                                        //获取B复选框的选中值
                                        var b= $('input[name="B"]').prop("checked");
                                        //获取C下拉框的选中值
                                        var c= jQuery("#C").val();
                                        //获取D下拉框的选中值
                                        var d= jQuery("#D").val();
                                            case '通道一':
                                            //复选框赋值
                                            $('#a1').prop("checked", a);
                                            $('#b1').prop("checked", b);
                                            //下拉框赋值
                                            $("#c1").val(c);
                                            $("#d1").val(d);
                                            //清空复选框
                                            $('#A').prop("checked", false);
                                            $('#B').prop("checked", false);
                                            //清空切换前的下拉框
                                            $('#C').empty();
                                            $('#D').empty();
                                            $('#Aisle').empty();
                                            //layui局部更新
                                            form.render();

                                            break;
                                            case '通道二':
                                                   //根据第一个写
                                            break;
                                            case '通道三':
                                                  //根据第一个写
                                            break;
                                            case '通道四':
                                                 //根据第一个写
                                            break;
                                break; 
                                case 2: 
                                //根据第一个写
                                break;
                                 case 3: 
                                //根据第一个写
                                break;
                                 case 4: 
                                //根据第一个写
                                break;
                                }

在这个功能中，个人认为难点有三：
一、如何取值（这个可以在设计数据库的时候就做好规划）
二、如何赋值
三、逻辑关系判定