使用layui table达到穿梭框效果

由于自己文章写得transfer过于操蛋,现在直接使用两个table来实现transfer的功能,与layui的穿梭框不同的是,里面的值虽然也是一一对应的,但是右侧框是可以显示左侧框没有的值。且也不会因为左侧框的值变化右侧框也跟着变化

<script th:inline="javascript">
    // const index = parent.layer.getFrameIndex(window.name);
    /*<![CDATA[*/
    layui.use(['layer', 'form', 'upload', 'table'], function () {
        let layer = layui.layer,
            form = layui.form,
            table = layui.table,
            $ = layui.$;
        layui.config({
            base: '/'
        }).extend({
            authtree: 'authtree/authtree',
        });
        //----------------------------------------
        //穿梭框初始化
        let dataList, dataListLeft;
        // 执行一个 table实例
        let id = $("input[name='id']").val();
        $.ajax({
            type: "post",
            url: '/customer/list4Trans',// 数据接口
            async: false,
            cache: false,
            data: {
                id: id
            }, success: function (data) {
                dataList = data.data;
                table.render({
                    elem: '#dataList',
                    data: dataList
                    , title: '记录表'
                    , height: 320 // 开启分页
                    , method: 'post', // 默认get方式,
                    limit: 40
                    , cols: [[// 表头
            
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值