Фильтр даты применяется ко всем вкладкам таблиц данных - PullRequest
0 голосов
/ 24 апреля 2020

У меня есть 3 вкладки (ожидающие, опубликованные и заархивированные), каждая из которых состоит из следующего HTML кода:

HTML для ожидающей вкладки

<label for="pending-fromDate">publication Date from</label>
<input type="text" class="datepicker" id="pending-fromDate"> 

<label for="pending-toDate">publication Date from</label>
<input type="text" class="datepicker" id="pending-toDate">

<button type="button" id="resetButton-pending">Reset</button>

<table id="pending-data-table" style="width: 100%;"
    class="table table-condensed table-hover table-striped js-dashboard-table">
    <thead>
        <tr id="pending-data-table-col">
            <th data-column-id="id-pending">Id</th>
            <th data-column-id="name-pending">name</th>
            <th data-column-id="publication-pending">publication Date</th>
            <th data-column-id="closing-pending">closing Date</th>
        </tr>
    </thead>
</table>

Проблема в том, что, когда я применяю фильтр даты на вкладке, а затем нажимаю кнопку отдыха на другой вкладке, содержимое всех таблиц реагирует на фильтр. Это похоже на то, что все данные являются зависимыми.

Это мой JS код:

JS

var tabName = $('#pending-data-table'); 

tabName.dataTable({
    initComplete : function() {
        var table = tabName.DataTable();
            $('#pending-rows-number').text('(' + this.api().data().count() + ')');
            searchDatesField(table, 2, 'pending-fromDate', 'pending-toDate', 'pending');
        //...
    }
});

function searchDatesField(table, columnIndex, fieldNameFrom, fieldNameTo, tabName) {


var datax = table.rows().data();
    $.fn.dataTable.ext.search.push(function(settings, datax, dataIndex) {
        var max, min;
        var fromDate = $('#'+ fieldNameFrom).val();
        var toDate = $('#'+ fieldNameTo).val();

        if (fromDate.length > 0){
            min = getFilterDateValue(fromDate);
        } else {
            min = null;
        }

        if (toDate.length > 0){
            max = getFilterDateValue(toDate);;
        } else {
            max = null;
        }

        var filterDate = new Date(datax[columnIndex].substring(0,4) + '-' 
                + datax[columnIndex].substring(4,6) + '-' 
                + datax[columnIndex].substring(6,8));

        if (min == null && max == null){
            return true;
        } else if (min == null && max != null ){
            if (filterDate <= max){
                return true;
            }
        } else if(min != null && max == null ){
            if(filterDate >= min){
                return true;
            }
        } else if (min != null && max != null) { 
            if(filterDate >= min && filterDate <= max){
                return true;
            }
        }

        return false;
    });

    initDatePickerActions(fieldNameFrom, table, tabName);
    initDatePickerActions(fieldNameTo, table, tabName);
}   

function initDatePickerActions(dateField, table, tabName){
    $('#'+ dateField).Zebra_DatePicker({
        format: 'd/m/Y',
        onSelect: function(view, elements){
            table.draw();
            if(tabName != ''){
                updateTableRowsNumber(table, $('#'+ tabName +'-rows-number'));
            }
        },
        onClear: function(view, elements){
            table.draw();
            if(tabName != ''){
                updateTableRowsNumber(table, $('#'+ tabName +'-rows-number'));
            }
        }
    });
}

И кнопка позволяет сбросить все поля:

function resetSearchFields(tabName) {
    var fieldSelector = '#search-filters';

    if(tabName != ''){
        fieldSelector = '#'+ tabName +'-tab';
    }

    $(fieldSelector +' .datepicker').each(function() {
        $(this).data('Zebra_DatePicker').clear_date();
    });

    $(fieldSelector +' select').each(function() {
        $(this).val('All').change();
    });

    $(fieldSelector +' input:not(.datepicker)').each(function(){
        $(this).val('').keyup();
    });
}

Есть ли у вас какие-либо идеи, как сделать сброс применимым только к активным фильтрам вкладок ??

Спасибо

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