首页 > 其他分享 >layui Table控件选择一行获取选择行信息

layui Table控件选择一行获取选择行信息

时间:2023-01-09 10:34:09浏览次数:41  
标签:控件 center title layui table var Table dt

layui Table控件选择一行获取选择行信息

1、获取Table操作句柄

//临时保存JSON
var coursetime;
//table控制变量
var tablecourse;

function initDataTable(dt) {
    coursetime = dt;
    layui.use('table', function () {
        var table = layui.table;
        tablecourse = table;
        inittabledata(dt);

    });
}

2、映射表格

function inittabledata(dt) {
    $("#ptimelistjson").val(JSON.stringify(dt));
    tablecourse.render({
        elem: '#usdatagrid',
        cols: [[ //表头
            { type: 'numbers', align: 'center', title: '序号' }
            , { type: 'radio', align: 'center', title: '选择' }
            , { field: 'name', title: '分段名称', align: 'center', style: 'color:#1E9FFF', width: 200 }
            , { field: 'min', title: '最小值', align: 'center', width: 200 }
            , { field: 'max', title: '最大值', align: 'center', width: 200 }
        ]], limit: 1000,
        data: dt
        , height: '260'
    });
}

3、效果

4、选择列选择按钮后返回选择的该行数据

//获取到选择行的数据    usdatagrid为elem的值    elem: '#usdatagrid',
var sel = tablecourse.checkStatus('usdatagrid').data;
//获取长度
var ilength = sel.length;

效果如下图:

 

 

 

标签:控件,center,title,layui,table,var,Table,dt
From: https://www.cnblogs.com/ZhuMeng-Chao/p/17036215.html

相关文章