GridManager 隱蔽列

GridManager 表格治理組件, 對列的隱蔽與顯現的操縱有兩種體式格局。

初始化時指定列為隱蔽或顯現狀況。體式格局以下:

<table></table>
var table = document.querySelector('table');
table.GM({
    gridManagerName: 'test',
    ajax_url: 'http://www.lovejavascript.com/learnLinkManager/getLearnLinkList',
    columnData: [{
        key: 'name',
        // 指定不顯現該列
        isShow: false,
        text: 'username'
    },{
        key: 'type',
        // 指定顯現該列
        isShow: true,
        text: 'type'
    },{
        key: 'info',
        // 不指定該列的顯現狀況, 默以為true
        text: 'info'
    }]
});

襯着完成后,對列舉行隱蔽或顯現操縱。在已實行過init的前提下,可通過以下體式格局對列舉行操縱:

// 對第一列舉行顯現
var table = document.querySelector('table');
var th_name = table.querySelector('th[th-name="name"]');
table.GM('showTh', th_name);
// 對第二列舉行隱蔽
var table = document.querySelector('table');
var th_type = table.querySelector('th[th-name="type"]');
table.GM('hideTh', th_type);
// 批量操縱 -> 隱蔽第二和第三列
var table = document.querySelector('table');
var thList = table.querySelectorAll('th');
document.querySelector('table').GM('hideTh', [thList[1], thList[2]]); 
// 批量操縱 -> 顯現悉數列
var table = document.querySelector('table');
var thList = table.querySelectorAll('th');
document.querySelector('table').GM('showTh', thList); 
    原文作者:拭目以待
    原文地址: https://segmentfault.com/a/1190000014800147
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞