Как использовать класс меток в datatable с акцентированной базой данных? - PullRequest
0 голосов
/ 06 мая 2019

У меня проблема с добавлением класса Label в столбец данных. Моя база данных (сервер SQL) имеет акценты (в основном "é"), которые не позволяют использовать код jquery для правильной работы.

Слова без акцентов работают нормально. Я попробовал все с теми, с акцентами без удачи, они показаны только цветом по умолчанию. я даже пробовал разные коды нейтрализации акцента без результата.

function removeAccents ( data ) {
    return data
        .replace( /έ/g, 'ε' )
        .replace( /[ύϋΰ]/g, 'υ' )
        .replace( /ό/g, 'ο' )
        .replace( /ώ/g, 'ω' )
        .replace( /ά/g, 'α' )
        .replace( /[ίϊΐ]/g, 'ι' )
        .replace( /ή/g, 'η' )
        .replace( /\n/g, ' ' )
        .replace( /á/g, 'a' )
        .replace( /é/g, 'e' )
        .replace( /í/g, 'i' )
        .replace( /ó/g, 'o' )
        .replace( /ú/g, 'u' )
        .replace( /ê/g, 'e' )
        .replace( /î/g, 'i' )
        .replace( /ô/g, 'o' )
        .replace( /è/g, 'e' )
        .replace( /ï/g, 'i' )
        .replace( /ü/g, 'u' )
        .replace( /ã/g, 'a' )
        .replace( /õ/g, 'o' )
        .replace( /ç/g, 'c' )
        .replace( /ì/g, 'i' );
}

var searchType = jQuery.fn.DataTable.ext.type.search;

searchType.html = function ( data ) {
    return ! data ?
        '' :
        typeof data === 'string' ?
            removeAccents( data.replace( /<.*?>/g, '' ) ) :
            data;
};

var dataTable = $('.table').dataTable({
                                    scrollX: true,
                  dom: 'Bfrtip',
                  buttons: {            
                        dom: {
                            button: {
                                className: 'btn btn-default'
                            }
                        },
                        buttons: [
                              {extend: 'colvis'},
                              {extend: 'copy'},
                              {extend: 'csv'},
                              {extend: 'print'}
                        ]},
                                    columnDefs: [
                                        {
                                            'data' : 'id_statut',
                                            "targets": 12,
                                            render: function (data, type, row, meta) {
                                                if (type === 'display') {
                                                    var label = 'label-default';
                                    if (data == "A Valider SH") {
                                                    label = 'label-warning';
                                                    }
                                                if (data == "A Valider RI") {
                                                    label = 'label-warning';
                                                }
                                                if (data == "A planifier") {
                                                    label = 'bg-purple';
                                                }
                                                if (data == "A traiter") {
                                                    label = 'bg-brown';
                                                }
                                                if (data == "En cours de traitement") {
                                                    label = 'label-info';
                                                }
                                                if (data == 'Manque Information' ) {
                                                    label = 'bg-teal';
                                                }
                                                if (data == "A Valider" ) {
                                                    label = 'bg-pink';
                                                }
                                                if (data == "Manque Information RI" ) {
                                                    label = 'bg-violet';
                                                }
                                                if (data === 'Traité' ) {
                                                    label = 'bg-violet';
                                                }
                                        return '<span class="label ' + label + '">' + data + '</span>';
                                            }
                                            return data;
                                        }
                                    }
                                ]
                                });

Фактический результат:

enter image description here

чего я пытаюсь достичь:

http://demo.interface.club/limitless/demo/bs4/Template/layout_1/LTR/default/full/datatable_basic.html

1 Ответ

0 голосов
/ 28 мая 2019

Решил, добавив data.substr (x, y) к словам с ударением

$(document).ready(function(){
$("input[type=submit]").button();
$('.table').dataTable({
              scrollX: true,
              dom: 'lBfrtip',
              buttons: {            
                    dom: {
                        button: {
                            className: 'btn btn-default'
                        }
                    },
                    buttons: [
                            {extend: 'colvis'},
                            {extend: 'copy'},
                            'excel',
                            {
                            extend: 'pdf',
                            orientation: 'landscape',
                            exportOptions: {
                            columns: 'thead th:not(.noExport)'
                            }
                            },
                            {
                            extend: 'print',
                            exportOptions: {
                            columns: 'thead th:not(.noExport)'
                            }
                            }
                            ]},
                                columnDefs: [
                        {
                        'data' : 'id',
                        "targets": 1,
                        render: function (data, type, row, meta) {

                                            if (type === 'display') {
                                                var label = 'label-default';
                                            if (data == "A valider") {
                                                label = 'bg-orange';
                                                }
                                            if (data == "Encours") {
                                                label = 'label-info';
                                            }
                                            if (data.substr(0,5) == "Annul") {
                                                label = 'bg-danger';
                                            }
                                            if (data.substr(0,6) == "Affect") {
                                                label = 'bg-green';
                                            }
                                            if (data.substr(0,2) == "Cl") {
                                                label = 'bg-brown';
                                            }
                                            if (data.substr(0,5) == 'Trait' ) {
                                                label = 'bg-success';
                                            }
                                            if (data == "Traitement en cours" ) {
                                                label = 'bg-primary';
                                            }
                                            if (data.substr(0,5) == "Achev" ) {
                                                label = 'bg-teal';
                                            }
                                            if (data.substr(0,8) == "Actions " ) {
                                                label = 'bg-pink';
                                            }
                                            if (data.substr(0,12) == "Actions Valid" ) {
                                                label = 'bg-indigo-400';
                                            }
                                            if (data.substr(0,6) == "Clotur" ) {
                                                label = 'bg-slate';
                                            }
                                    return '<span class="label ' + label + '">' + data + '</span>';
                                        }
                                        return data;
                                    }
                                }
                            ]
                            });
...