layui数据表格中加动态下拉框并监听

下拉框
<script type="text/html" id="selectEducation">
    {{#  if(d.mDataMeasurand == null){  }}
    <select name="dataexpstr2"  lay-filter="dataexpstr3" data-value="{{d.Nid}}">
        <option value="">--请选择--</option>
    </select>
    {{#     }else{ }}
    {{ d.mDataMeasurand.dataexpstr }}
    {{#  } }}

</script>

<!--行工具栏-->
<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs layui-btn-disabled" lay-event="detail">保存</a>
</script>
<!--数据表格-->
<table id="demo" lay-filter="test"></table>

<script>
    layui.use(['table', 'jquery', 'form'], function () {
        var table = layui.table;
        var form = layui.form;
        var $ = layui.jquery;
        var tableObject;
        //第一个实例
        tableObject = table.render({
            id: 'terminalList',
            elem: '#demo'
            , height: 500
            // , url: 'https://192.168.0.68:8081/FDatameasurandXmd/findAll' //数据接口
            , url: 'https://localhost:8080/findAll' //数据接口
            //, page: true //开启分页
            , method: 'post'
            , toolbar: true
            , cols: [[ //表头
                {field: 'gDataname', title: '数据', align: 'center'}
                , {
                    field: 'Nid', title: '数据名称', templet: '#selectEducation'
                    , align: 'center'
                }
                , {
                    field: '', title: '匹配状态', align: 'center', templet: function (d) {
                        if (d.mDataMeasurand == null) {
                            return "未匹配";
                        } else {
                            return "已匹配";
                        }
                    }
                }  //
                , {fixed: 'right', width: 150, align: 'center', toolbar: '#barDemo'} //这里的toolbar值是模板元素的选择器
            ]]
            , done: function (res, curr, count) {
                tabData = res.data;

                //动态插入  边缘代理数据名称  读取 m_data_measurand
                $.ajax({
                    url: "https://localhost:8080/findByName",
                    data: {},
                    dataType: "json",
                    type: "post",
                    success: function (res1) {
                        $(res1).each(function (i) {
                            // console.log("aaa"+res1[i].ndataid+","+res1[i].dataexpstr)
                            var option = $('<option value="' + res1[i].ndataid + '">' + res1[i].dataexpstr + '</option>');
                            $("select[name = 'dataexpstr2']").append(option);
                        })
                        form.render('select');
                    }
                });

                //数据渲染完的回调。
                //由于layui 设置了超出隐藏，所以这里改变下，以兼容操作按钮的下拉菜单
                $(".layui-table-body, .layui-table-box, .layui-table-cell").css('overflow', 'visible');
            }
        });


        var flag;
        //通过下拉框监听事件 拿到gDataid
        var optionvalue;
        var i =1;
        form.on('select(dataexpstr3)', function (data) {
                // $(data.elem).attr
                if( i == 1  && data.elem.getAttribute("id") == null){
                    $(data.elem).attr("id", "a1");
                    i = "a1";
                }

                if (optionvalue != '' && i== data.elem.getAttribute("id")) {
                    optionvalue = data.value;
                    // $(data.elem).attr("id", "a"+(i++));// ???
                    // flag = "false";
                    let tr = $(data.elem).parents()[2]; //拿到父节点中第二个父节点
                    let tmp = $(tr).children()[3] //拿到父节点中的第三个子节点
                    $(tmp).children().children().removeClass('layui-btn-disabled') //拿到第三个子节点的子节点的子节点然后删除class 中的layui-btn-disabled样式
                    console.log(data.elem.getAttribute("id"))
                    //  console.log($("#a1"))
                    // console.log($(data.elem))
                }else {
                    layer.msg("选中行中数据没保存,请先保存");
                    $(data.elem).val('');
                    form.render('select');
                    return false
                }
          
            console.log("第一次赋值：" + optionvalue)
        })

        
//监听工具条   行操作
        console.log("给他们用的：" + optionvalue)
        table.on('tool(test)', function (obj) { //注：tool 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）

            if (layEvent === 'detail') { //保存
                console.log("拿到" + optionvalue)
                // console.log($("#Nid").val()+","+data.gDataname)
                $.ajax({
                    url: "https://localhost:8081/xxx",
                    data: {
                        gDataname: data.gDataname,
                        gDataid: optionvalue
                    }, dataType: "json",
                    type: "post",
                    success: function (res) {
                        //修改 m_data_measurand中的状态
                    }
                });
                //  console.log($("#Nid").val())
                $.ajax({
                    url: "https://localhost:8081/xxxx",
                    data: {
                        ndataid: optionvalue
                    },
                    dataType: "json",
                    type: "post",
                    success: function (res1) {

                    }
                });
                // 点击保存后i修改为1
                i=1;
                window.location.reload();
            }
        });


    })
</script>