Question

我有一个包含9列的数据表，隐藏了列[0]和[8]。然后将列[7]和[8]合并为一列（参见下面的代码）。

我正在努力的一点是当我隐藏一个列时使用ColVis插件，列[7]和[8]的合并被搞砸了。

希望有意义，任何帮助都会非常感激。

var $buTable= $("#business_table").dataTable( {
        "oLanguage": {
            "sSearch": "Filter:"
        },
        "bProcessing": true,
        "bServerSide": true,
        "sAjaxSource": "scripts/business_serverside.php",
    "iDisplayLength": 10,       
        "bJQueryUI": false,
        "sPaginationType": "scrolling",
        "sDom": '<"clear"><"top"CTilr<"clear">pt>',
        "aoColumns": [ 
            {"bVisible":false},
            {"bVisible":true},
            {"bVisible":true},
            {"bVisible":true},
            {"bVisible":true},
            {"bVisible":true},
            {"bVisible":true},
            {"bVisible":true},
            {"bVisible":false}
        ],
        "fnRowCallback": function( nRow, aData, iDisplayIndex ) {
        $('td:eq(6)', nRow).html(''+ aData[7] +'&nbsp;'+ aData[8] +'');        
        },
        "oTableTools": {
            "sSwfPath": "swf/copy_csv_xls_pdf.swf"
        },
        "oColVis": {
            "activate": "mouseover",    
            "aiExclude": [0,8]
        }
    }).columnFilter({
            aoColumns: [ 
                    { type: "select"},
                    { type: "text" },
                    { type: "select" },
                    { type: "select"},
                    { type: "text"},
                    { type: "text"},
                    { type: "select"},
                    { type: "text"}
                ]
        });

Answer 1

现在你排除了允许隐藏的列：

"oColVis": {
    "activate": "mouseover",    
    "aiExclude": [0,8]
}

但是我认为你需要做的是a）将它们排除在隐藏状态以便它们永远不会被篡改，或者b）编写一个链接其可见性状态的回调方法，这样如果一个被隐藏，另一个被自动隐藏并且明智地让他们变得可见。

在数据表init中添加fnDrawCallback之类的东西：

// method gets called each table draw / re-draw
"fnDrawCallback": function( oSettings ) {
    // column buttons get ids based on their column title 
    // so let's assume your columns are titled 'column7' and 'column8'
    $('#column7').change( function() {
        $('#column8').trigger('click');
    });

    $('#column8').change( function() {
        $('#column7').trigger('click');
    });
},

代码未经测试但如果您发现无法在$（'＃column8）和$（'＃column7'）上调用事件更改事件，则您必须手动检查第7列的可见性。随机猜测如何做到这一点就像：

"fnDrawCallback": function( oSettings ) {
    if( fnSetColumnVis( 7, false ) ) {
        fnSetColumnVis( 8, false );
    }
    else {
        fnSetColumnVis( 8, true );
    }
},

希望有所帮助！

Datatables ColVis插件 - 隐藏列和列合并

1 个答案: