table 中 有两个select 在选择其中做一个select 动态给其他的select赋值

提问 已结 18 187
tx
tx 2019-5-16
悬赏:20飞吻
在select监听中 获取另外的select的值 需要获取该对象 那么这个对象怎么获取

以下是监听select的代码
layui.form.on('select(type_select)', function (data) {
var selectElem = $(data.elem);
var tdElem = selectElem.closest('td');
var trElem = tdElem.closest('tr');
var driver1=[]
if (data.value == "外叫车") {
driver1.push({ text: '张三', value: '张三' });
driver1.push({ text: '张三1', value: '张三1' })
driver1.push({ text: '张三2', value: '张三2' })
}
else {
driver1.push({ text: '李四', value: '李四' });
driver1.push({ text: '李四1', value: '李四1' })
driver1.push({ text: '李四2', value: '李四2' })
}
driver = driver1;
layui.table.render('select','driver_select');
layui.table.cache["middle_datatable"][trElem.data('index')][tdElem.data('field')] = data.value;
});
回帖
  • 红烧鱼i
    2019-5-16
    <!DOCTYPE html>
    <html>

    <head>
    <meta charset="utf-8">
    <title></title>
    <link rel="stylesheet" type="text/css" href="layui-v2.4.5/css/layui.css">
    <script type="text/javascript" src="jquery-3.1.1.min.js"></script>
    <script type="text/javascript" src="layui-v2.4.5/layui.js"></script>
    <style type="text/css">
    .layui-table-cell {
    height: 40px;
    }
    </style>
    </head>

    <body>
    <table lay-filter="test" id="test"></table>
    </body>
    <script type="text/html" id="titleTpl1">
    <div class="layui-inline">
    <div class="layui-input-inline" id="IDD_{{d.LAY_INDEX}}">
    <select name="modules" lay-filter="one" >
    <option value="">直接选择或搜索选择</option>
    <option value="外叫车">外叫车</option>
    <option value="2">易语言</option>
    <option value="3">go</option>
    </select>
    </div>
    </div>
    </script>
    <script type="text/html" id="titleTpl2">
    <div class="layui-inline">
    <div class="layui-input-inline layui-form" lay-filter="two{{d.LAY_INDEX}}" id="ID_{{d.LAY_INDEX}}">
    <select name="modules" id="selected_{{d.LAY_INDEX}}" >
    <option value="">直接选择或搜索选择</option>
    </select>
    </div>
    </div>
    </script>
    <script>
    layui.use('table', function() {
    var table = layui.table,
    form = layui.form;

    table.render({
    elem: '#test',
    cellMinWidth: 80,
    height:800,
    cols: [
    [
    { type: 'numbers' },
    { type: 'checkbox' },
    { field: 'id', title: 'ID', width: 100, unresize: true, sort: true },
    { field: 'username', title: '用户名'},
    { field: 'city', title: '城市' },
    { field: 'select1', title: '选择一',templet: '#titleTpl1' },
    { field: 'select2', title: '选择二',templet: '#titleTpl2' }
    ]
    ],
    data:[
    {"username":"贤心","city":"武汉"},
    {"username":"闲心","city":"北京"},
    ],
    page: true,
    done:function(){
    var tableView = this.elem.next(".layui-table-view");
    layui.each(tableView.find("tbody select"), function (index, item) {
    var elem = $(item);
    elem.parents('div.layui-table-cell').css('overflow', 'visible');
    });
    }
    });

    //监听性别操作
    form.on('select(one)', function(obj) {
    debugger;
    var index = $(obj.elem).parent().attr("id").split("_")[1];
    var text = $(obj.elem).find("option:selected").text();
    var value = obj.value;
    // console.log(obj)
    $("#selected_"+index).html("");
    var baseOption = '<option value="">直接选择或搜索选择</option>';
    var option = '<option value="'+value+'">'+text+'</option>';
    $("#selected_"+index).append(baseOption);
    $("#selected_"+index).append(option);
    form.render('select', 'two'+index);
    });
    });
    </script>

    </html>
    0 回复
  • 这不就是级联吗,有很多例子可以参考的。
    0 回复
  • tx
    2019-5-16
    你在表格中不能设置其id 你要获取行对象下的select
    0 回复
  • tx
    2019-5-16
    @ 恰似你的温柔
    0 回复
  • tx
    2019-5-16
    0 回复
  • @tx 你这是table里面的select?这个有点难度。[吃惊]
    0 回复
  • tx
    2019-5-16
    @恰似你的温柔 我现在获取纠结的问题 1.怎么获取行对象 2获取获取行对象下select 3行对象下的select的重新渲染
    0 回复
  • @tx 我刚才试着写了一下,可以实现,QQ895132650,这边截图太费劲了。
    0 回复
  • tx
    2019-5-16
    @恰似你的温柔 我好想也能实现了 我已经回去到对应对象了
    $("tbody tr[data-index='" + trElem.data('index') + "'] select[lay-filter='driver_select']")
    0 回复
  • tx
    2019-5-16
    @恰似你的温柔 这个select怎么重新渲染啊
    0 回复