this.dtOptions = { pagingType: 'full_numbers', pageLength: 10, serverSide: true, responsive: true, autoWidth: false, language: this.dataTableLanguage, ajax: (dataTablesParameters: any, callback) => { let params = {...dataTablesParameters}; this.countryService.getPaged(params) .subscribe({ next(response) { callback({ recordsTotal: response.recordsTotal, recordsFiltered: response.recordsTotal, data: response.data }); }, error(msg) { callback({ recordsTotal: 0, recordsFiltered: 0, data: [] }); self.notifierService.notify('error', self.translateService.instant('translations.notifier.error.data-fetching-error')); } }); }, order: [ [ 0, 'asc' ] ], columns: [ { data: 'name', orderable: true, }, { data: 'latinName', orderable: true, }, { data: 'alphaCode2', orderable: true, }, /* {data: 'alphaCode3', orderable: true, width: '10%'}, {data: 'currencyCode', orderable: true, width: '10%'}, {data: 'phoneCode', orderable: true, width: '10%'}, {data: 'numberCode', orderable: true, width: '5%'}, {data: 'riskDegree', orderable: true, width: '5%'}, */ { data: 'isDeleted', orderable: true, render: function (data: any, type: any, full: any) { if (data) { return '<span class="badge bg-soft-danger text-danger">' + self.translateService.instant('translations.country.index.grid.cell.delete-no') + '</span>'; } else { return '<span class="badge bg-soft-success text-success">' + self.translateService.instant('translations.country.index.grid.cell.delete-yes') + '</span>'; } } }, { data: null, orderable: false, defaultContent: '', ngTemplateRef: { ref: this.dtActions, context: { captureEvents: self.onCaptureEvent.bind(self) } } } ] };