如何删除JQuery Datatables中的列?

时间:2021-01-20 14:27:21

I want to remove the columns which have total = 0.

我想删除总数= 0的列。

So I've tried in different ways.

所以我尝试过不同的方式。

First, I assigned ID to all columns, for example; every <td> is of column will have their ID eg: First columns <td ID = 'col_1'> , second column all <td ID = 'col_2'> etc. And then in when footer callback I've tried to remove if this column total is ZERO then this $("col_"+i).remove(); this code removed table headers only so I've tried again with $("col_"+i).empty() but again it's just empty. <th> only

首先,我为所有列分配了ID,例如;列的每个都会有他们的ID,例如:第一列,第二列全部等等然后在页脚回调时我试图删除if这个列总数是零,那么这个$(“col _”+ i).remove();这段代码只删除了表头,所以我再次尝试使用$(“col _”+ i).empty(),但它又是空的。只有

Then I've tried to hide the columns by creating dynamic but I don't get any values.

然后我试图通过创建动态来隐藏列,但我没有得到任何值。

    "footerCallback": function ( row, data, start, end, display ) 
    {
        var api = this.api(), data;  
        var intVal = function ( i ) { return typeof i === 'string' ? i.replace(/[\$,]/g, '')*1 : typeof i === 'number' ?    i : 0;};

        var col_gonna_invis = '[';
        for(i=1;i<length_of_coloumns;i++)
            {
                total_salary = api.column( i ).data().reduce( function (a, b) {return intVal(a) + intVal(b);},0 );
                $('#total_cont_'+i).html(total_salary); 
                if(total_salary == 0)
                {
                    col_gonna_invis += '{"targets": [ '+i+' ], "visible": false, "searchable": false },';
                }
            }
        col_gonna_invis += ']';alert(col_gonna_invis);  
    },

    "aoColumnDefs": col_gonna_invis;

Please someone help me fix this issue or please someone tell me how to hide or remove columns which footer total is 0.

请有人帮我解决这个问题,或者有人告诉我如何隐藏或删除页脚总数为0的列。

Thank you in advance.

先感谢您。

1 个解决方案

#1


2  

I will suggest you use the visible() API method along with the sum() plugin :

我建议你使用visible()API方法和sum()插件:

Enhance the API with a column().sum() method :

使用column()。sum()方法增强API:

jQuery.fn.dataTable.Api.register( 'sum()', function ( ) {
    return this.flatten().reduce( function ( a, b ) {
        if ( typeof a === 'string' ) {
            a = a.replace(/[^\d.-]/g, '') * 1;
        }
        if ( typeof b === 'string' ) {
            b = b.replace(/[^\d.-]/g, '') * 1;
        }

        return a + b;
    }, 0 );
} );

now, in initComplete() you can very easy hide columns which have a total or sum() of 0 :

现在,在initComplete()中,您可以非常轻松地隐藏total或sum()为0的列:

var table = $('#example').dataTable({
   //... 
   initComplete : function() {
      var api = this.api(), 
          colCount = api.row(0).data().length;
      for (var i=0; i<colCount; i++) {
          if (api.column(i).data().sum() == 0) {
              api.column(i).visible(false);
          }
      }     
    }
});

demo -> http://jsfiddle.net/qer7e5os/

演示 - > http://jsfiddle.net/qer7e5os/

#1


2  

I will suggest you use the visible() API method along with the sum() plugin :

我建议你使用visible()API方法和sum()插件:

Enhance the API with a column().sum() method :

使用column()。sum()方法增强API:

jQuery.fn.dataTable.Api.register( 'sum()', function ( ) {
    return this.flatten().reduce( function ( a, b ) {
        if ( typeof a === 'string' ) {
            a = a.replace(/[^\d.-]/g, '') * 1;
        }
        if ( typeof b === 'string' ) {
            b = b.replace(/[^\d.-]/g, '') * 1;
        }

        return a + b;
    }, 0 );
} );

now, in initComplete() you can very easy hide columns which have a total or sum() of 0 :

现在,在initComplete()中,您可以非常轻松地隐藏total或sum()为0的列:

var table = $('#example').dataTable({
   //... 
   initComplete : function() {
      var api = this.api(), 
          colCount = api.row(0).data().length;
      for (var i=0; i<colCount; i++) {
          if (api.column(i).data().sum() == 0) {
              api.column(i).visible(false);
          }
      }     
    }
});

demo -> http://jsfiddle.net/qer7e5os/

演示 - > http://jsfiddle.net/qer7e5os/