Question

下面是我的代码

HTML

<table class="list" id="ticketAgging" border="0" cellspacing="1" cellpadding="2" width="100%" >
    <thead>
        <tr>
        <tr>
            <th width="27.3%">consultant</th>
            <th>00-05 Dys</th>
            <th>05-10 Dys</th>
            <th>10-20 Dys</th>
            <th>20-30 Dys</th>
            <th>30-45 Dys</th>
            <th>45-60 Dys</th>
            <th>60+ Dys</th>
            <th id="col_8">Closed</th>
            <th>Grand Total</th>
        </tr>
        </tr>
    </thead>
    <tbody>

    </tbody>
    <tfoot>
    </tfoot>
</table>

jquery

var dTable = $('#ticketAgging').DataTable({
        "oLanguage": {
            "sZeroRecords": "<center>No Record Found!</center>",
            "sInfo": "Showing _START_ - _END_ of _TOTAL_ ",
            "sInfoEmpty": "Showing 0 - 0 of 0 ",
                       },
        responsive: true,
        bProcessing: true,
        bServerSide: true,
        autoWidth: true,
        bFilter: true,
        scrollCollapse: true,
        scrollX: true,
        iDisplayLength: 100,
        bLengthChange: false,
        searching: false,
        order: [],
        bPaginate: false,
        sAjaxSource: initialUrl,
        fnServerParams: function (aoData) {
            var ticketStatus = $("#ticket_status").val();
            var ticket_status_all = $("#ticket_status_all").val();
            var department = $("#department").val();
            var req_cat = $("#req_cat").val();
            var ticket_plan = $("#ticket_plan").val();
            var type = $("#type").val();
            var planenddate = $("#plan_end_date").val();
            aoData.push({"name": "ticketstatus", "value": ticketStatus});
            aoData.push({"name": "ticketstatusall", "value": ticket_status_all});
            aoData.push({"name": "department", "value": department});
            aoData.push({"name": "reqcat", "value": req_cat});
            aoData.push({"name": "ticketplan", "value": ticket_plan});
            aoData.push({"name": "type", "value": type});
            aoData.push({"name": "planenddate", "value": planenddate});
        },
        aoColumns: [
            {"sName": "consultant", "bSortable": true, },
            {"sName": "00_05_Dys", "bSortable": false},
            {"sName": "05_10_Dys", "bSortable": false},
            {"sName": "10_20_Dys", "bSortable": false},
            {"sName": "20_30_Dys", "bSortable": false},
            {"sName": "30_45_Dys", "bSortable": false},
            {"sName": "45_60_Dys", "bSortable": false},
            {"sName": "60_Dys", "bSortable": false},
            {"sName": "Closed", "bSortable": false},
            {"sName": "Grand_Total", "bSortable": false}
        ],
        aaSorting: [[0, 'desc']],
    });



 $("#status_all").change(function () {
        dTable.ajax.reload();
        var value = $("#ticket_status_all").val();
     if (value != '') {
           if (value == '1' || value == '2' || value == '6' || value == '8' || value == '9' || value == '10' || value == '11' || value == '12') {     
         dTable.columns([8]).visible(false);
              dTable.columns([1, 2, 3, 4, 5, 6, 7]).visible(true);
   }
            else {
               dTable.columns([1, 2, 3, 4, 5, 6, 7]).visible(false);
              dTable.columns([8]).visible(true);
          }
      }else{
           dTable.columns([1, 2, 3, 4, 5, 6, 7]).visible(true);
              dTable.columns([8]).visible(true);
       }
    });

如果我从上面第8列显示/隐藏的单列工作，它工作正常，但是当我在显示/隐藏多列时为多列显示/隐藏推出代码时，它给出了如下所示的错误< / p>

Uncaught TypeError: Cannot read property 'style' of undefined
    at Ga (jquery.dataTables.min.js:59)
    at X (jquery.dataTables.min.js:11)
    at t.<anonymous> (jquery.dataTables.min.js:120)
    at t.iterator (jquery.dataTables.min.js:97)
    at t.<anonymous> (jquery.dataTables.min.js:119)
    at t.visible (jquery.dataTables.min.js:99)
    at HTMLSelectElement.<anonymous> (reports.php:350)
    at HTMLSelectElement.dispatch (jquery-1.11.2.min.js?901e5ea:3)
    at HTMLSelectElement.r.handle (jquery-1.11.2.min.js?901e5ea:3)

请任何人帮我解决这个问题，以便与多列show hide一起工作吗？我将很感激最佳答案

Answer 1

我得到了很多回答，如果从下面的链接使用jquery.datatable.min.js，我上面的代码将正常工作，没有任何错误

https://cdn.datatables.net/1.10.15/js/jquery.dataTables.min.js

数据表隐藏/显示多列不起作用

1 个答案: