PHP數據表隱藏多個列

Question

我試圖隱藏在數據表的多個列（8-25），只需一次點擊：

function fnShowHide() 
{ 
    /* Get the DataTables object again - this is not a recreation, just a get of the object */ 


    var oTable = $('#closing').dataTable(); 
    for(var i = 9; i <= 25; i++) { 
     var bVis = oTable.fnSettings().aoColumns[i].bVisible; 
     oTable.fnSetColumnVis(i, bVis ? false : true); 
    } 

} 

基於這種對標準的DataTable顯示/隱藏列，但不明白爲什麼它不工作。它只隱藏第一列。

Answer 1

我不知道，如果它是你與數據表工作以同樣的方式，我想你想它的點擊，而不是在負載，但這裏的作品我使用的代碼：

要注意：

{ "bSortable": false, "bSearchable": false, "bVisible": false, "aTargets": [ 9 ] }, 

定位欄＃9，no列上的排序，不可見。

示例代碼如下：

var table_data = $('#open_datatable').dataTable({ 
    "aoColumns": [ 
     { "sTitle": "", "sClass": "datatable-tiny datatable-center", "bSortable": false } 
     ,{ "sTitle": "ID", "sClass": "datatable-small" } 
     ,{ "sTitle": "Date", "sClass": "datatable-small" } 
     ,{ "sTitle": "Part Number" , "sClass": "datatable-large"} 
     ,{ "sTitle": "Customer", "sClass": "datatable-medium" } 
     ,{ "sTitle": "Manufacturer", "sClass": "datatable-large" } 
     ,{ "sTitle": "Quantity", "sClass": "datatable-medium datatable-center" } 
     ,{ "sTitle": "Price", "sClass": "datatable-medium datatable-center" }   
     ,{ "sTitle": "Description", "sClass": "" }   
     ,{ "sTitle": "Urgent", "sClass": "" }   
     ,{ "sTitle": "Search", "sClass": "" }   
     ,{ "sTitle": "", "sClass": "datatable-tiny datatable-center", "bSortable": false } 
     ] 
    ,"bJQueryUI": true 
    ,"sPaginationType": "full_numbers" 
    ,"bProcessing": true 
    ,"bServerSide": true 
    ,"sAjaxSource": "<?php echo $URL;?>" 
    ,"fnServerData": function (sSource, aoData, fnCallback) { 
     $.ajax({ 
      "dataType": 'json', 
      "type": "POST", 
      "url": sSource, 
      "data": aoData, 
      "success": fnCallback 
     }); 
    } 
    ,"bScrollCollapse": true 
    ,"fnDrawCallback": function() { 
     $('.hidden-img').each(function(){ 
      $(this).click(); 
     }); 

    } 
    ,"aoColumnDefs": [ 
         {"fnRender": function (o) { 
          return "<img src='<?= "img/img.png"; ?>' border='0' width='1px' height='1px' class='hidden-img'> "; 
         },"bSortable": false, "aTargets": [0]}, 
         {"fnRender": function (o) { 
          return o.aData[10]; 
         },"bSortable": false, "aTargets": [3]}, 
         {"fnRender": function (o) { 
          return "$<input type='text' value='"+CurrencyFormatted(o.aData[7], true)+"' class='input-target_price'>"; 
         },"aTargets": [7]}, 
         {"bSortable": false, "aTargets": [1]}, 
         {"bSortable": false, "aTargets": [2]}, 
         {"bSortable": false, "aTargets": [5]}, 
         {"fnRender": function (o) { 
          return "<input type='text' value='"+o.aData[6]+"' class='input-qty'>"; 
         }, "bSortable": false, "aTargets": [6]}, 
         {"bSortable": false, "aTargets": [7]}, 
         { "bSortable": false, "bSearchable": false, "bVisible": false, "aTargets": [ 4 ] }, 
         { "bSortable": false, "bSearchable": false, "bVisible": false, "aTargets": [ 8 ] }, 
         { "bSortable": false, "bSearchable": false, "bVisible": false, "aTargets": [ 9 ] }, 
         { "bSortable": false, "bSearchable": false, "bVisible": false, "aTargets": [ 10 ] }, 
         {"fnRender": function (o) { 
          return "<img src='<?= "img/img.png"; ?>' border='0' class='save' rel='"+o.aData[11]+"' >"; 
         },"aTargets": [11]} 
         ] // end aoColumnDefs 

    });//end Datatable 

希望這會有所幫助，我有很多的調整數據表在過去的麻煩，但他們是偉大的，當你得到它的竅門！

祝你好運。

Answer 2

您可以直接在列中使用.withClass（「無」），它會隱藏列

vm.dtOpt_SalesEntry = DTOptionsBuilder.newOptions() 
       .withOption('responsive', true) 
     vm.dtOpt_SalesEntry.withPaginationType('full_numbers'); 
     vm.dtOpt_SalesEntry.withColumnFilter({ 
      aoColumns: [{ 
        type: 'null' 
       }, { 
        type: 'text', 
        bRegex: true, 
        bSmart: true 
       }, { 
        type: 'text', 
        bRegex: true, 
        bsmart: true 
       }, { 
        type: 'select', 
        bRegex: false, 
        bSmart: true, 
        values: vm.dtSalesEntryUnitTypes 
       }, { 
        type: 'text', 
        bRegex: true, 
        bSmart: true 
       }] 
     }); 

     vm.dtColDefs_SalesEntry = [ 
      DTColumnDefBuilder.newColumnDef(0), DTColumnDefBuilder.newColumnDef(1), 
      DTColumnDefBuilder.newColumnDef(2), DTColumnDefBuilder.newColumnDef(3), 
      DTColumnDefBuilder.newColumnDef(4), DTColumnDefBuilder.newColumnDef(5).withClass('none'), 
      DTColumnDefBuilder.newColumnDef(6).withClass('none'), DTColumnDefBuilder.newColumnDef(7).withClass('none'), 
      DTColumnDefBuilder.newColumnDef(8).withClass('none'), DTColumnDefBuilder.newColumnDef(9).withClass('none'), 
      DTColumnDefBuilder.newColumnDef(10).withClass('none'), DTColumnDefBuilder.newColumnDef(11).withClass('none') 
     ];