Данные не заполняются в таблицах данных fixedcolumns при использовании вместе с обработкой на стороне сервера - PullRequest
0 голосов
/ 25 ноября 2018

Я использую DataTable в угловом проекте.Когда я использую fixedColumns вместе с обработкой serverSide, появляются fixedColumns (перекрывающиеся столбцы), но без данных.

Когда я использую table.fixedColumns (). Update () в функции setTimeout с интервалом времени 5000 мс, пустые строки появляются по-прежнемубез данных.

Количество пустых строк совпадает с количеством строк в исходных столбцах.

Почему данные не отображаются в fixedColumns (перекрывающиеся столбцы) как данные в исходных столбцах?

Ниже приведен пример кода:

var table = $('#contactusdt').DataTable({
  pagingType: 'full_numbers',
  pageLength: 10,
  lengthMenu: [10, 25, 100],
  serverSide: true,
  processing: true,
  responsive: true,
  searching: false,
  language: {
    "search": '<i class="fa fa-search search-eye"></i>',
    searchPlaceholder: 'Name / Email',
    processing: '<span ><img src="assets/img/busy.gif" alt="Loading.."></span> ',
    paginate: {
      first: '&laquo;',
      last: '&raquo;',
      next: '&#8250;',
      previous: '&#8249;'
    }
  },
  drawCallback: function (oSettings) {
    this.show();
      var pgr = $(oSettings.nTableWrapper).find('.dataTables_paginate')
      if (oSettings._iDisplayLength > oSettings.fnRecordsDisplay()) {
        pgr.hide();
      } else {
        pgr.show()
      }
  },
  "order": [[ 0, "desc" ]],
  "sDom": '<lfBptipr >',
  ajax: (dataTablesParameters: any, callback) => {
    var postPrams = this.getPostParameters("clsPostParam");        
    var date_from = this.getPostParameters("clsPostParam1");        
    var date_to = this.getPostParameters("clsPostParam2");        
    var custom_search = $('#search').val();
    dataTablesParameters.url = 'services_get_contact_details';
    dataTablesParameters.method = 'POST';
    dataTablesParameters.auth = localStorage.getItem('authkey');
    dataTablesParameters.data = {
      "condFilter": postPrams,
      "date_from": date_from,
      "date_to": date_to,
      "custom_search": custom_search
    };
    let jsondata = 'jsondata=' + JSON.stringify(dataTablesParameters);
    that.http
      .post<DataTablesResponse>(
        global.baseUrl,
        jsondata, { headers: headers }
      ).subscribe(resp => {
        if (resp) {
          this.contactDetails$ = resp['data'];
          $('.content-wrapper').removeClass('overlay');
        }
        callback({
          recordsTotal: resp.recordsTotal,
          recordsFiltered: resp.recordsFiltered,
          data: []
        });
      });
  },
  "columnDefs": [{
    "targets": 0,
    "orderable": false
  }, {
    "targets": 2,
    "orderable": false
  }, {
    "targets": 4,
    "orderable": false
  },
  {
    "targets": 5,
    "orderable": false
  },
  {
    "targets": 8,
    "orderable": false,
    "width": "20%"
  },
  {
    "targets": 9,
    "orderable": false
  }
  ],
  buttons: {
    dom: {
      button: {
        tag: 'button',
        className: ''
      }
    },
    buttons: [
      {
        text: '<i class="fa fa-repeat"></i>',
        action: function () {              
          $('#leadsource').val(null).trigger('change.select2');
          $('#leadstatus').val(null).trigger('change.select2');
          $('#c_start_date').val('');
          $('#c_end_date').val('');
          $('#search').val('');              
          that.reload();
        },
        className: ' btn btn-xs resetbtn'
      },          
    ]
  },
  scrollX:        true,
  scrollCollapse: true,
  paging:         true,  
  "initComplete": function (settings, json) {        
    var table = $('#contactusdt').dataTable().api();
    var fixedColumns = new $.fn.dataTable.FixedColumns( table, {
      leftColumns: 2,
      rightColumns: 2,
      heightMatch: 'none'
    } );
    //table.fixedColumns().update();
  }        
});
setTimeout( function() {
    var table = $('#contactusdt').DataTable();
    table.fixedColumns().update();          
}, 5000);

Я не вижу никаких ошибок в моей консоли.

DataTable Screenshot

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...