jQuery动态隐藏列不起作用

Question

jquery datatables在datepicker之后无效。

我使用colvis按钮实现了jquery datatable插件，以动态显示和隐藏列。 它在浏览器加载方面运行良好。但是当我选择日期选择器到某个日期时，它不会更改包含该日期的列 交易数据来自服务器。我怎么能这样做？

merchant.js

$(document).ready(function(){

  //DateTables for transcations

$('#example').dataTable( {
        "dom": 'C>"clear"<lfrtip',

        paging:false,
        searching:false,

        colVis: {
            exclude: [ 0 ],
             "buttonText": "Customize Columns"

        }
    } );
//Date picker as a filter initialization
  var options2 = { orientation: $('body').hasClass('right-to-left') ? "auto right" : 'auto auto', format: 'yyyy/mm/dd'}

  $('input#start-date').datepicker(options2).on('changeDate', function(e){
    $.cookie('ajax_option', '&ajax_option=' + $(e.target).parent('div#bs-datepicker-range').data('filter-position'));
    $.cookie('startdate', '&startdate=' + e.format(0, 'yyyy/mm/dd'));
    $.cookie('enddate', '&enddate=' + $('input#end-date').val());
    request_filter_data();
  });

  $('input#end-date').datepicker(options2).on('changeDate', function(e){
    $.cookie('ajax_option', '&ajax_option=' + $(e.target).parent('div#bs-datepicker-range').data('filter-position'));
    $.cookie('startdate', '&startdate=' + $('input#start-date').val());
    $.cookie('enddate', '&enddate=' + e.format(0, 'yyyy/mm/dd'));
    request_filter_data();
  });

//Load - more for transactions table  # I need the datatable to work here as well, when I click load more button.
  $('a.load-more').click(function(e) {
    count = $(this).data('clicks');
    var url = window.location.href;
    $.cookie('ajax_option', '&ajax_option=load_more');
    $.cookie('clicks', '&clicks=' + count);
    var filterData = get_filter_url();
    $.get(url, filterData, function(data){
      $('tbody#details').append(data);
      $('a.load-more').data('clicks', $('a.load-more').data('clicks') + 1);

    });
    return false;
  });

transacation.html.erb文件

<div class="panel">
  <div class="panel-heading">
    <span class="panel-title"><i class="fa fa-exchange"></i>&nbsp;&nbsp;Transactions</span>
    <%= render partial: 'date_filter', locals: {filter_name: 'load_more'}%>
  </div>
  <div id="merchant_list" class="panel-body">
    <div class="table-success">
      <table id ="example" class="table table-bordered">
        <thead>
        <tr>
          <th>Merchant</th>
          <th>Bank Name</th>
          <th>Payment Gateway</th>
          <th>Status</th>
          <th>Amount</th>
          <th>Discount</th>
          <th>Additional Charges</th>
          <th>Added On</th>
        </tr>
        </thead>
        <tbody id="details">
        <% @all_settlement_details.each do |sd| %>
            <tr>
              <td><%= sd.merchantname %></td>
              <td><%= sd.bank_name  %></td>
              <td><%= sd.payment_gateway %></td>
              <td><%= get_status(sd.status) %></td>
              <td><%= sd.amount %></td>
              <td><%= sd.discount %></td>
              <td><%= sd.additional_charges%></td>
              <td><%= get_added_on_date sd.addedon %></td>
            </tr>
        <% end %>
        </tbody>

      </table>
      <div id="align">
        <a href="" class="load-more" data-clicks="1">Load more...</a>
      </div>
    </div>
  </div>
</div>