layui table獲取第一個元素


頁面上的元素:

<table id="aaaaa" style="height: 300px;" class="layui-hide" lay-filter="type" width="100%" data-type="getType"></table>

js:

layui.use('table', function () {
        table = layui.table;
        element = element;
        //方法級渲染
        tableIns = table.render({
            id: 'aaaaaa',
            elem: '#aaaaaa',
        //表數據接口地址 url:
'/aa/bb/cc',
        //列: cols: [[ { title:
'序號', width: '20%', templet: function (res) { return res.LAY_INDEX; } }, {field: 'xxx', title: 'xxx列名稱', width: '60%', sort: false}, {field: 'www', title: 'www列名稱', width: '20%', toolbar: "#toolBarType"} ]],
        //是否分頁 page:
true,
        //渲染完成,以及調用更新方法渲染后的事件: done: function (res, currentCount) {
          
          //獲取表格的第一行
let firstType = $('.layui-table-view[lay-id="aaaaaa"]').children('.layui-table-box').children('.layui-table-body').find('table tbody tr[data-index="0"]'); if(firstType.length > 0){
            //如果有第一個元素,自動點擊一下 firstType.click(); }
else{
            //因為頁面中有多個表格,所以自定義了一個方法,可以根據表格的id清空表格 clearLayuiTable(
"aaaaaa"); } } }); table.on('tool(type)', function (obj) { var data = obj.data; if (obj.event === 'detailType') { //查看事件 }if(obj.event === 'editType') { //編輯事件 }if (obj.event === 'delType') { //刪除事件 } }) table.on('row(type)', function(obj){
       //行點擊事件
var data = obj.data; }); })

表格的事件按鈕:  (這里的toolBarType需要跟上面的toolbar一致)

<script type="text/html" id="toolBarType">
   <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="detailType">查看</a>
    <a class="layui-btn layui-btn-xs  layui-btn-normal" lay-event="editType">編輯</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="delType">刪除</a>
</script>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM