Таблицы данных / YADCF и фильтрация порядка сортировки

Я использую datatables и yadcf для фильтрации по месяцам и дням недели, но не могу правильно отсортировать списки выбора.

<table id="myTable" class="table table-striped">
<thead>
<tr>
<th>ID</th>
<th>Name</th>
<th>Month</th>
<th>Weekday</th>
</tr>
</thead>
</table>
var myData = [
    {"Id":1,"Name":"Test 1","Month":{"Id":5,"Label":"May"},"Weekday":{"Id":3,"Label":"Tuesday"}},
    {"Id":2,"Name":"Test 2","Month":{"Id":5,"Label":"May"},"Weekday":{"Id":3,"Label":"Tuesday"}}
    ...
];

$(function () {
    var Table = $('#myTable').DataTable({
        'data': myData,
        "columns" : [
            { "targets": 0, "data" : "Id" },
            { "targets": 1, "data" : "Name" },
            { "targets": 2, "data": function ( data, type, val, meta ) {
                if (type === 'display') {
                    return  data.Month.Label;

                }else if (type === 'filter') {
                    return data.Month.Label;
                }
                // 'sort', 'type' and undefined all just use the integer
                return data.Month.Id;
            } },
            { "targets": 3, "data": function ( data, type, val, meta ) {
                if (type === 'display') {
                    return  data.Weekday.Label;

                }else if (type === 'filter') {
                    return data.Weekday.Label;
                }
                // 'sort', 'type' and undefined all just use the integer
                return data.Weekday.Id;
            } }
        ]
    });

    yadcf.init(Table, [
        {
            column_number : 2, 
            filter_type: 'select',
            filter_match_mode: 'exact', 
            style_class: 'form-control'
        },
        {
            column_number : 3, 
            filter_type: 'select',
            filter_match_mode: 'exact', 
            style_class: 'form-control'
        }
    ]);
} );

Фильтр выбора не упорядочивает

Как заказать эти фильтры, чтобы они упорядочивали январь, февраль, март и рабочие дни понедельник, вторник, среду и т. д.?

Fiddle: https://jsfiddle.net/Webkungen/jLq6okgc/2/

Если я добавлю пользовательскую функцию сортировки для фильтра и верну data.Month.Id для фильтра, сортировка будет правильной, но тогда в фильтре будет отображаться номер месяца вместо его имени.

Ценю любую помощь в этом, так как это сводит меня с ума, спасибо!


person Webkungen    schedule 12.04.2021    source источник


Ответы (1)


Вы должны использовать sort_as: 'custom', sort_as_custom_func: monthSort И реализовать свою собственную функцию сортировки, вот быстрый способ:

$(function () {
    var Table = $('#myTable').DataTable({
        'data': myData,
        "columns" : [
            { "data" : "Id" },
            { "data" : "Name" },
            { "data" : "Month.Label" },
            { "data" : "Weekday.Label" }
        ]
    });

    yadcf.init(Table, [
        {
            column_number : 2, 
            filter_type: 'select',
            filter_match_mode: 'exact', 
            style_class: 'form-control',
            sort_as: 'custom',
            sort_as_custom_func: monthSort
        },
        {
            column_number : 3, 
            filter_type: 'select',
            filter_match_mode: 'exact', 
            style_class: 'form-control'
        }
    ]);
  
  function monthSort(a, b){
    var months = ["January", "February", "March", "April", "May", "June",
        "July", "August", "September", "October", "November", "December"];
         return months.indexOf(a) - months.indexOf(b);}
} );

Вот ссылка на рабочую тестовую страницу

person Daniel    schedule 12.04.2021
comment
Спасибо, работает нормально в течение нескольких месяцев, но не могу понять, как быть с будними днями, на моем сервере разработки, который находится на английском языке, будние дни работают нормально, но на производстве, где он локализован (шведский в случае) порядок: воскресенье, вторник, Понедельник. Я не очень понимаю логику пользовательской функции сортировки? - person Webkungen; 13.04.2021
comment
Ах, извините за путаницу, не имеет ничего общего с номером месяца/дня недели. Я изменил сервер, который обслуживает локализованное имя, и соответствующий массив в пользовательской функции теперь работает на обоих серверах. Благодарю вас! - person Webkungen; 13.04.2021