jQuery DataTable - класс элементов удаляется после сортировки - PullRequest
Новая
       3

jQuery DataTable - класс элементов удаляется после сортировки

0 голосов
/ 06 февраля 2020

Я занимаюсь разработкой приложения django. В моем шаблоне HTML у меня есть таблица, в которой одна из двух строк, которую я динамически создаю. Это соответствующий td: 

                             <td>
                                <div class="row">
                                    {% for d in p.get_list_of_lists %}
                                        <div class="a-box">{{ d.0 }}</div>
                                    {% endfor %}
                                </div>
                            <div class="row">
                                    {% for d in p.get_list_of_lists %}
                                        <div class="b-box">{{ d.1 }}</div>
                                    {% endfor %}
                                </div>
                            </td>

Я запускаю функцию javascript для документа, готового динамически добавлять класс к каждому из a-box: 

function createSquares() {
    $('.a-box').each(function () {
        a= this.innerText
        switch (a) {
            case "1":
                $(this).addClass('great')
                break;
            case "2":
                $(this).addClass('good')
                break;
            case "3":
                $(this).addClass('ok')
                break;
            case "4":
                $(this).addClass('tough')
                break;
            case "5":
                $(this).addClass('bad')
                break;
            default:
            // code block
        }
    });
}

Вот код для jQuery dataTable: 

function createTable() {
    dt = $('#data')
    if (dt) {
        dt.DataTable({
            "order": [[3, "desc"]],
            "aLengthMenu": [[25, 50, 75, -1], [25, 50, 75, "All"]],
            "iDisplayLength": 25,
            'aoColumnDefs': [{
                'bSortable': false,
                'aTargets': ['nosort']
            }]
        });
    }
}

Все работает хорошо. Я могу покрасить каждую коробку нужным цветом. Однако, когда я сортирую таблицу по одному из столбцов, некоторые из добавленных мной классов (отлично, хорошо, хорошо, плохо) удаляются, а некоторые остаются. Я не могу понять, почему и в чем разница между теми, кто остается, и теми, кто этого не делает.

Ценю вашу помощь

1 Ответ

1 голос
/ 07 февраля 2020

Мне удалось решить проблему, переместив createSquares в createTable, как предложено выше. 

function createTable() {
    dt = $('#Data')
    if (dt) {
        dt.DataTable({
            "order": [[4, "desc"]],
            "aLengthMenu": [[25, 50, 75, -1], [25, 50, 75, "All"]],
            "iDisplayLength": 25,
            'aoColumnDefs': [{
                'bSortable': false,
                'aTargets': ['nosort']
            }],
            "createdRow": function (row, data, index) {
                createFiveNext()
            }
        });
    }
}
...